<!DOCTYPE html><html lang="en"> <head><!-- Global Metadata --><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><script>(function(){const siteVariantDomains = [{"id":"chatgpt-docs","domains":["learn.chatgpt.com","learn.chatgpt-staging.com","learn-chatgpt-preview.localhost"]}];
const forcedSiteVariantId = undefined;
const siteVariantQueryParam = "site_variant";
const chatGptSiteVariant = "chatgpt";
const chatGptDocsVariantId = "chatgpt-docs";
const developersOpenAiHostname = "developers.openai.com";

  (() => {
    const hostname = window.location.hostname.toLowerCase().replace(/\.$/, "");
    const queryVariant =
      hostname !== developersOpenAiHostname &&
      new URLSearchParams(window.location.search).get(siteVariantQueryParam) ===
        chatGptSiteVariant
        ? chatGptDocsVariantId
        : undefined;
    const hostnameVariant = siteVariantDomains.find((variant) =>
      variant.domains.some(
        (domain) => domain.toLowerCase().replace(/\.$/, "") === hostname
      )
    )?.id;
    const activeVariantId =
      forcedSiteVariantId || hostnameVariant || queryVariant;

    if (forcedSiteVariantId) {
      document.documentElement.dataset.siteVariantForced = forcedSiteVariantId;
    } else {
      delete document.documentElement.dataset.siteVariantForced;
    }

    if (activeVariantId) {
      document.documentElement.dataset.siteVariant = activeVariantId;
    } else {
      delete document.documentElement.dataset.siteVariant;
    }
  })();
})();</script><link rel="icon" type="image/png" href="/favicon.png"><meta name="generator" content="Astro v6.0.4"><link rel="preload" href="/fonts/OpenAISans-Regular.woff" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/OpenAISans-Bold.woff" as="font" type="font/woff" crossorigin><style>
  @layer theme, base, components, utilities;
</style><!-- Canonical URL --><link rel="canonical" href="https://developers.openai.com/api/docs"><!-- Primary Meta Tags --><title data-default-meta-title="OpenAI API Platform Documentation">
  OpenAI API Platform Documentation
</title><meta name="title" content="OpenAI API Platform Documentation"><meta name="description" content="Explore guides, API docs, and examples for the OpenAI API."><!-- Open Graph / Facebook --><meta property="og:type" content="website"><meta property="og:url" content="https://developers.openai.com/api/docs"><meta property="og:site_name" content="OpenAI Developers"><meta property="og:title" content="OpenAI API Platform Documentation"><meta property="og:description" content="Explore guides, API docs, and examples for the OpenAI API."><meta property="og:image" content="https://developers.openai.com/og/api/docs.png"><meta property="og:image:alt" content="OpenAI API Platform Documentation"><meta property="og:image:width" content="1200"><meta property="og:image:height" content="630"><!-- Twitter --><meta name="twitter:card" content="summary_large_image"><meta name="twitter:site" content="@OpenAIDevs"><meta name="twitter:url" content="https://developers.openai.com/api/docs"><meta name="twitter:title" content="OpenAI API Platform Documentation"><meta name="twitter:description" content="Explore guides, API docs, and examples for the OpenAI API."><meta name="twitter:image" content="https://developers.openai.com/og/api/docs.png"><meta name="twitter:image:width" content="1200"><meta name="twitter:image:height" content="630"><meta name="twitter:image:alt" content="OpenAI API Platform Documentation"><!-- Sitemap --><link rel="sitemap" href="/sitemap-index.xml"><!-- RSS Feed --><link rel="alternate" type="application/rss+xml" title="OpenAI API Platform Documentation" data-page-meta-title href="https://developers.openai.com/rss.xml"><!-- Global Scripts --><script src="/js/theme.js"></script><script src="/js/scroll.js"></script><script src="/js/animate.js"></script><script defer src="/js/copy.js"></script><meta name="astro-view-transitions-enabled" content="true"><meta name="astro-view-transitions-fallback" content="swap"><script type="module" src="/_astro/ClientRouter.astro_astro_type_script_index_0_lang.CGcTWOWP.js"></script><link rel="stylesheet" href="/_astro/platform-docs.C8tKlvDz.css">
<link rel="stylesheet" href="/_astro/PageLayout.CKzFpz4q.css">
<link rel="stylesheet" href="/_astro/index.DHZqO9n4.css">
<style>@layer components.base{._root_1x2h7_2{position:relative;display:flex;flex-direction:column;margin:20px 0;border:.5px solid var(--color-border-primary-surface);border-radius:8px;background:var(--code-snippet-bg)}._root_1x2h7_2+._root_1x2h7_2{margin-top:1em}._flush_1x2h7_16{width:100%;border:0;background:transparent;background-color:transparent;color:var(--color-text-emphasis);line-height:20px}._flush_1x2h7_16 code>code{padding-right:20px!important}._flush_1x2h7_16 .syntax-highlighter{background:transparent;font-size:13px;letter-spacing:var(--font-tracking-wide)}._flush_1x2h7_16 ._header_1x2h7_34{position:relative;z-index:1;justify-content:space-between;padding-left:8px;border-bottom:none;background:transparent}._flush_1x2h7_16 ._header_1x2h7_34 ._title_1x2h7_42{display:none}._flush_1x2h7_16 ._header_1x2h7_34 .code-sample-select-val{font-size:12px;letter-spacing:var(--font-tracking-wide)}._flush_1x2h7_16 ._header_1x2h7_34 .code-sample-select-wrap{margin-bottom:4px;margin-left:12px;font-size:12px;letter-spacing:var(--font-tracking-wide)}._flush_1x2h7_16 ._body_1x2h7_59{background:transparent}._flush_1x2h7_16 ._body_1x2h7_59 ._pre_1x2h7_62{padding-top:0}._root_1x2h7_2 .python-upgrade-banner{display:flex;padding:2px;background:var(--card-gradient);color:#fff;font-size:.8em;font-weight:var(--font-weight-bold);text-align:center}._root_1x2h7_2 .python-upgrade-banner svg{margin-top:6px;margin-right:8px;margin-left:8px}._root_1x2h7_2 .python-upgrade-banner path{stroke:#fff}._header_1x2h7_34{overflow:auto;display:flex;align-items:center;gap:4px;flex-shrink:0;padding:4px 8px 4px 14px;border-bottom:.5px solid var(--color-border-primary-surface);border-top-left-radius:8px;border-top-right-radius:8px}._title_1x2h7_42{overflow:hidden;flex:1 1 auto;margin-right:12px;color:var(--color-text);font-family:var(--monospace);font-size:12px;font-weight:var(--font-weight-normal);letter-spacing:var(--font-tracking-wide);text-overflow:ellipsis;white-space:nowrap}._sep_1x2h7_113{flex:0 0 auto;min-width:1px;height:22px;padding-left:8px;border-left:1px solid var(--color-background-primary-soft);margin-left:8px}._body_1x2h7_59{position:relative;flex-grow:1;flex-shrink:0}._body_1x2h7_59 ._pre_1x2h7_62{height:100%;min-height:44px;padding:12px 16px;border-radius:8px;margin:0;font-size:14px;line-height:20px;white-space:pre;background:var(--code-snippet-bg)}._body_1x2h7_59._bodyWithHeader_1x2h7_139 ._pre_1x2h7_62{border-top-left-radius:0;border-top-right-radius:0}._bodyWithCopyFloat_1x2h7_145 ._pre_1x2h7_62{padding-right:56px}._copyFloat_1x2h7_157{position:absolute;top:6px;right:6px}._oneliner_1x2h7_162 ._copyFloat_1x2h7_157{top:50%;transform:translateY(-50%)}._copyButton_1x2h7_168{height:1.75rem;padding:0 .5rem;border-radius:.375rem}}
@layer components{._ModelsTitle_163e7_1{font-size:30px;font-weight:var(--font-weight-semibold);letter-spacing:var(--font-tracking-tight);line-height:1.3}}@layer components{._SectionContent_1tiej_1>*{border-top:1px solid var(--color-background-primary-soft)}}
@layer base{.syntax-highlighter{background:transparent;color:var(--color-text);overflow-x:auto}.syntax-highlighter>code{border:none;box-shadow:none;font-family:var(--monospace)}.syntax-highlighter>code>code{padding-right:16px;border:none;box-shadow:none;float:left;font-family:var(--monospace);line-height:20px}.syntax-highlighter .react-syntax-highlighter-line-number{color:var(--color-text-disabled);line-height:20px;opacity:.5;text-align:right;-webkit-user-select:none;-moz-user-select:none;user-select:none}.syntax-highlighter [data-highlighted-row=true]{display:block;width:150%;margin-left:-25%;background-color:var(--pill-success-bg)}.syntax-highlighter [data-highlighted-row-subtle=true]{background-color:rgba(var(--sh-fg),.08)}.hljs-comment{color:rgba(var(--sh-fg),.5)}.hljs-meta{color:rgba(var(--sh-fg),.6)}.hljs-built_in,.hljs-class .hljs-title{color:var(--syntax1)}.hljs-doctag,.hljs-keyword,.hljs-formula,.hljs-literal{color:var(--syntax2)}.hljs-string,.hljs-regexp,.hljs-addition,.hljs-attribute,.hljs-meta-string{color:var(--syntax3)}.hljs-attr,.hljs-variable,.hljs-template-variable,.hljs-type,.hljs-selector-class,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-number{color:var(--syntax4)}.hljs-symbol,.hljs-bullet,.hljs-link,.hljs-selector-id,.hljs-title{color:var(--syntax5)}}
</style><script type="module" src="/_astro/page.DUfwm0Z5.js"></script></head> <body class="overflow-x-hidden" data-pagefind-filter="section:api" data-has-context-subnav="true"> <script type="module" src="/_astro/Header.astro_astro_type_script_index_0_lang.EtnZuB3p.js"></script> <header id="header" class="fixed top-0 w-full h-16 z-50 bg-white dark:bg-black border-b border-primary-surface astro-3ef6ksr2"> <div class="flex items-center h-full px-4 md:px-8 lg:grid lg:grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] lg:gap-6 astro-3ef6ksr2"> <!-- Logo --> <a href="/" class="flex items-center font-semibold ml-0 lg:-ml-2 lg:justify-self-start astro-3ef6ksr2"> <img src="/OpenAI_Developers.svg" alt="OpenAI Developers" class="h-6 w-48 md:h-6 dark:invert astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> <span class="flex items-center text-default astro-3ef6ksr2" data-site-visibility-include="chatgpt-docs">  <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" fill="currentColor" viewBox="0 0 100 100" class="h-6 w-6 astro-3ef6ksr2 " aria-hidden="true" ><path color="currentColor" d="M38.355 36.52v-9.415c0-.793.297-1.388.99-1.784l18.93-10.902c2.578-1.486 5.65-2.18 8.82-2.18 11.894 0 19.426 9.218 19.426 19.029 0 .694 0 1.486-.1 2.28L66.799 22.05c-1.189-.694-2.379-.694-3.568 0L38.355 36.52Zm44.202 36.67V50.694c0-1.388-.596-2.38-1.785-3.073L55.897 33.15l8.126-4.658c.694-.396 1.289-.396 1.982 0l18.93 10.902c5.452 3.172 9.118 9.91 9.118 16.452 0 7.531-4.46 14.47-11.496 17.344Zm-50.05-19.82-8.127-4.757c-.693-.396-.99-.99-.99-1.784V25.025c0-10.605 8.126-18.633 19.127-18.633 4.163 0 8.028 1.388 11.3 3.865l-19.525 11.3c-1.189.693-1.784 1.684-1.784 3.072v28.74ZM50 63.478l-11.645-6.541V43.062L50 36.522l11.645 6.54v13.875L50 63.477Zm7.483 30.129c-4.163 0-8.028-1.388-11.3-3.865l19.525-11.3c1.189-.693 1.784-1.684 1.784-3.071V46.629l8.226 4.757c.694.396.991.991.991 1.784v21.803c0 10.605-8.226 18.633-19.226 18.633v.001Zm-23.49-22.101-18.93-10.902c-5.45-3.172-9.117-9.91-9.117-16.451 0-7.632 4.559-14.47 11.595-17.344v22.596c0 1.388.595 2.379 1.784 3.072l24.777 14.37-8.126 4.659c-.694.396-1.289.396-1.982 0ZM32.905 87.76c-11.2 0-19.425-8.425-19.425-18.83 0-.794.1-1.587.198-2.38L33.2 77.85c1.189.693 2.379.693 3.568 0l24.876-14.37v9.415c0 .793-.298 1.388-.992 1.784L41.724 85.58c-2.576 1.486-5.649 2.18-8.82 2.18h.001Zm24.579 11.793c11.992 0 22.001-8.523 24.281-19.822C92.864 76.857 100 66.451 100 55.846c0-6.937-2.973-13.676-8.325-18.533.496-2.081.793-4.163.793-6.243 0-14.172-11.496-24.777-24.777-24.777-2.676 0-5.253.396-7.83 1.288C55.401 3.221 49.257.445 42.517.445c-11.992 0-22.001 8.523-24.281 19.822C7.136 23.14 0 33.547 0 44.152c0 6.938 2.973 13.676 8.325 18.533-.496 2.081-.793 4.163-.793 6.243 0 14.172 11.497 24.778 24.777 24.778 2.676 0 5.253-.397 7.83-1.289 4.459 4.36 10.604 7.136 17.344 7.136Z"></path></svg> <span class="sr-only astro-3ef6ksr2">ChatGPT</span>  </span> </a> <!-- Links --> <nav class="hidden lg:flex items-center justify-center gap-1 astro-3ef6ksr2"> <div class="relative group astro-3ef6ksr2"> <a href="/" class="flex items-center gap-1 text-sm px-2.5 py-1 rounded-md text-primary-soft hover:text-default hover:bg-primary-soft-alpha astro-3ef6ksr2"> Home  </a>  </div><div class="relative group astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> <a href="/api/docs" class="flex items-center gap-1 text-sm px-2.5 py-1 rounded-md text-default bg-primary-soft astro-3ef6ksr2"> API  </a>  </div><div class="relative group astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> <a href="https://learn.chatgpt.com/docs" target="_blank" rel="noopener noreferrer" class="flex items-center gap-1 text-sm px-2.5 py-1 rounded-md text-primary-soft hover:text-default hover:bg-primary-soft-alpha astro-3ef6ksr2" aria-haspopup="menu"> Codex <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-3.5 w-3.5 text-tertiary astro-3ef6ksr2 " ><path d="M11.2929 16.2929C11.6834 16.6834 12.3166 16.6834 12.7071 16.2929L18.7071 10.2929C19.0976 9.90237 19.0976 9.26921 18.7071 8.87868C18.3166 8.48816 17.6834 8.48816 17.2929 8.87868L12 14.1716L6.70711 8.87868C6.31658 8.48816 5.68342 8.48816 5.29289 8.87868C4.90237 9.26921 4.90237 9.90237 5.29289 10.2929L11.2929 16.2929Z" fill="currentColor"></path></svg> </a> <div class="invisible opacity-0 absolute left-0 top-full z-50 mt-2 min-w-full w-max transition-opacity duration-150 group-hover:visible group-hover:opacity-100 group-focus-within:visible group-focus-within:opacity-100 before:content-[''] before:absolute before:-top-2 before:left-0 before:right-0 before:h-2 astro-3ef6ksr2" role="menu"> <div class="overflow-hidden rounded-md border border-primary-surface bg-surface shadow-md ring-1 ring-black/5 dark:ring-white/10 astro-3ef6ksr2"> <div class="astro-3ef6ksr2"> <a role="menuitem" href="https://learn.chatgpt.com/docs" target="_blank" rel="noopener noreferrer" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Docs</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Guides, concepts, and product docs for Codex </div> </div> </a><a role="menuitem" href="https://learn.chatgpt.com/use-cases" target="_blank" rel="noopener noreferrer" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Use cases</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Example workflows and tasks teams can take on with ChatGPT or Codex </div> </div> </a> </div> </div> </div> </div><div class="relative group astro-3ef6ksr2" data-site-visibility-include="chatgpt-docs"> <a href="/codex" class="flex items-center gap-1 text-sm px-2.5 py-1 rounded-md text-primary-soft hover:text-default hover:bg-primary-soft-alpha astro-3ef6ksr2"> Docs  </a>  </div><div class="relative group astro-3ef6ksr2" data-site-visibility-include="chatgpt-docs"> <a href="/codex/use-cases" class="flex items-center gap-1 text-sm px-2.5 py-1 rounded-md text-primary-soft hover:text-default hover:bg-primary-soft-alpha astro-3ef6ksr2"> Use cases  </a>  </div><div class="relative group astro-3ef6ksr2" data-site-visibility-include="chatgpt-docs"> <a href="/codex/resources" class="flex items-center gap-1 text-sm px-2.5 py-1 rounded-md text-primary-soft hover:text-default hover:bg-primary-soft-alpha astro-3ef6ksr2"> Resources  </a>  </div><div class="relative group astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> <a href="/chatgpt" class="flex items-center gap-1 text-sm px-2.5 py-1 rounded-md text-primary-soft hover:text-default hover:bg-primary-soft-alpha astro-3ef6ksr2" aria-haspopup="menu"> ChatGPT <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-3.5 w-3.5 text-tertiary astro-3ef6ksr2 " ><path d="M11.2929 16.2929C11.6834 16.6834 12.3166 16.6834 12.7071 16.2929L18.7071 10.2929C19.0976 9.90237 19.0976 9.26921 18.7071 8.87868C18.3166 8.48816 17.6834 8.48816 17.2929 8.87868L12 14.1716L6.70711 8.87868C6.31658 8.48816 5.68342 8.48816 5.29289 8.87868C4.90237 9.26921 4.90237 9.90237 5.29289 10.2929L11.2929 16.2929Z" fill="currentColor"></path></svg> </a> <div class="invisible opacity-0 absolute left-0 top-full z-50 mt-2 min-w-full w-max transition-opacity duration-150 group-hover:visible group-hover:opacity-100 group-focus-within:visible group-focus-within:opacity-100 before:content-[''] before:absolute before:-top-2 before:left-0 before:right-0 before:h-2 astro-3ef6ksr2" role="menu"> <div class="overflow-hidden rounded-md border border-primary-surface bg-surface shadow-md ring-1 ring-black/5 dark:ring-white/10 astro-3ef6ksr2"> <div class="astro-3ef6ksr2"> <a role="menuitem" href="/apps-sdk" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Apps SDK</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Build apps to extend ChatGPT </div> </div> </a><a role="menuitem" href="/workspace-agents" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Workspace Agents</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Trigger published ChatGPT workspace agents </div> </div> </a><a role="menuitem" href="/commerce" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Commerce</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Build commerce flows in ChatGPT </div> </div> </a><a role="menuitem" href="/ads" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Ads</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Publish and measure ads in ChatGPT </div> </div> </a> </div> </div> </div> </div><div class="relative group astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> <a href="/learn" class="flex items-center gap-1 text-sm px-2.5 py-1 rounded-md text-primary-soft hover:text-default hover:bg-primary-soft-alpha astro-3ef6ksr2" aria-haspopup="menu"> Resources <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-3.5 w-3.5 text-tertiary astro-3ef6ksr2 " ><path d="M11.2929 16.2929C11.6834 16.6834 12.3166 16.6834 12.7071 16.2929L18.7071 10.2929C19.0976 9.90237 19.0976 9.26921 18.7071 8.87868C18.3166 8.48816 17.6834 8.48816 17.2929 8.87868L12 14.1716L6.70711 8.87868C6.31658 8.48816 5.68342 8.48816 5.29289 8.87868C4.90237 9.26921 4.90237 9.90237 5.29289 10.2929L11.2929 16.2929Z" fill="currentColor"></path></svg> </a> <div class="invisible opacity-0 absolute left-0 top-full z-50 mt-2 min-w-full w-max transition-opacity duration-150 group-hover:visible group-hover:opacity-100 group-focus-within:visible group-focus-within:opacity-100 before:content-[''] before:absolute before:-top-2 before:left-0 before:right-0 before:h-2 astro-3ef6ksr2" role="menu"> <div class="overflow-hidden rounded-md border border-primary-surface bg-surface shadow-md ring-1 ring-black/5 dark:ring-white/10 astro-3ef6ksr2"> <div class="astro-3ef6ksr2"> <a role="menuitem" href="/showcase" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Showcase</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Demo apps to get inspired </div> </div> </a><a role="menuitem" href="/blog" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Blog</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Learnings and experiences from developers </div> </div> </a><a role="menuitem" href="/cookbook" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Cookbook</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Notebook examples for building with OpenAI models </div> </div> </a><a role="menuitem" href="/learn" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Learn</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Docs, videos, and demo apps for building with OpenAI </div> </div> </a><a role="menuitem" href="/community" class="block px-4 py-3 text-sm text-default transition-colors hover:bg-primary-soft-alpha dark:hover:bg-alpha-10 hover:text-default astro-3ef6ksr2"> <div class="flex flex-col gap-1 astro-3ef6ksr2"> <div class="font-medium astro-3ef6ksr2">Community</div> <div class="text-sm text-secondary astro-3ef6ksr2"> Programs, meetups, and support for builders </div> </div> </a> </div> </div> </div> </div>  </nav> <!-- Theme Toggle, Mobile Menu --> <div class="ml-auto flex items-center gap-4 lg:gap-5 lg:ml-0 lg:justify-end lg:justify-self-end astro-3ef6ksr2"> <button type="button" data-header-search-button aria-controls="header-search-overlay" aria-expanded="false" class="hidden min-w-52 items-center justify-between gap-3 rounded-full border border-primary-surface bg-surface px-4 py-2 text-sm text-secondary transition-colors hover:bg-primary-soft-alpha hover:text-default xl:flex astro-3ef6ksr2"> <span class="truncate astro-3ef6ksr2">Start searching</span> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4 shrink-0 astro-3ef6ksr2 " ><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg> </button> <div class="hidden lg:flex astro-3ef6ksr2"> <div data-site-visibility-exclude="chatgpt-docs" class="astro-3ef6ksr2"> <div class="flex items-center gap-2"><a target="_blank" rel="noopener noreferrer" href="https://platform.openai.com/login" class="_Button_6dmow_1 not-prose !h-9 !w-9 justify-center !px-0 min-[1000px]:!w-auto min-[1000px]:!px-4" data-color="primary" data-variant="solid" data-pill="" data-size="md"><span class="_ButtonInner_6dmow_4"><span class="sr-only min-[1000px]:not-sr-only">API Dashboard</span><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" data-external-link-indicator="persistent" class="shrink-0"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></span></a></div> </div><div data-site-visibility-include="chatgpt-docs" class="astro-3ef6ksr2"> <div class="flex items-center gap-2"><a target="_blank" rel="noopener noreferrer" href="https://chatgpt.com/" class="_Button_6dmow_1 not-prose  !w-9 justify-center !px-0 min-[1000px]:!w-auto min-[1000px]:!px-4" data-color="primary" data-variant="solid" data-pill="" data-size="lg"><span class="_ButtonInner_6dmow_4"><span class="sr-only min-[1000px]:not-sr-only">Try ChatGPT</span><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" data-external-link-indicator="persistent" class="shrink-0"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></span></a></div> </div> </div> <button id="header-theme-button" aria-label="Toggle light and dark theme" class="hidden lg:flex text-secondary hover:text-default transition-colors astro-3ef6ksr2"> <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg" class="block dark:hidden w-4 h-4 astro-3ef6ksr2 " ><path fill-rule="evenodd" clip-rule="evenodd" d="M11 0C11.5523 0 12 0.447715 12 1V3C12 3.55228 11.5523 4 11 4C10.4477 4 10 3.55228 10 3V1C10 0.447715 10.4477 0 11 0ZM3.22183 3.22183C3.61235 2.8313 4.24551 2.8313 4.63604 3.22183L6.05025 4.63604C6.44078 5.02656 6.44078 5.65973 6.05025 6.05025C5.65973 6.44078 5.02656 6.44078 4.63604 6.05025L3.22183 4.63604C2.8313 4.24551 2.8313 3.61235 3.22183 3.22183ZM18.7782 3.22183C19.1687 3.61235 19.1687 4.24551 18.7782 4.63604L17.364 6.05025C16.9734 6.44078 16.3403 6.44078 15.9497 6.05025C15.5592 5.65973 15.5592 5.02656 15.9497 4.63604L17.364 3.22183C17.7545 2.8313 18.3876 2.8313 18.7782 3.22183ZM11 8C9.34315 8 8 9.34315 8 11C8 12.6569 9.34315 14 11 14C12.6569 14 14 12.6569 14 11C14 9.34315 12.6569 8 11 8ZM6 11C6 8.23858 8.23858 6 11 6C13.7614 6 16 8.23858 16 11C16 13.7614 13.7614 16 11 16C8.23858 16 6 13.7614 6 11ZM0 11C0 10.4477 0.447715 10 1 10H3C3.55228 10 4 10.4477 4 11C4 11.5523 3.55228 12 3 12H1C0.447715 12 0 11.5523 0 11ZM18 11C18 10.4477 18.4477 10 19 10H21C21.5523 10 22 10.4477 22 11C22 11.5523 21.5523 12 21 12H19C18.4477 12 18 11.5523 18 11ZM6.05025 15.9497C6.44078 16.3403 6.44078 16.9734 6.05025 17.364L4.63604 18.7782C4.24551 19.1687 3.61235 19.1687 3.22183 18.7782C2.8313 18.3876 2.8313 17.7545 3.22183 17.364L4.63604 15.9497C5.02656 15.5592 5.65973 15.5592 6.05025 15.9497ZM15.9497 15.9497C16.3403 15.5592 16.9734 15.5592 17.364 15.9497L18.7782 17.364C19.1687 17.7545 19.1687 18.3876 18.7782 18.7782C18.3877 19.1687 17.7545 19.1687 17.364 18.7782L15.9497 17.364C15.5592 16.9734 15.5592 16.3403 15.9497 15.9497ZM11 18C11.5523 18 12 18.4477 12 19V21C12 21.5523 11.5523 22 11 22C10.4477 22 10 21.5523 10 21V19C10 18.4477 10.4477 18 11 18Z" fill="currentColor"></path></svg> <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" class="hidden dark:block w-4 h-4 astro-3ef6ksr2 " ><path d="M10.7836 0.470481C10.9676 0.765118 10.9855 1.13415 10.8309 1.44525C10.2994 2.51497 10 3.7211 10 5.00001C10 9.41829 13.5817 13 18 13L18.0575 12.9998C18.4049 12.9974 18.7287 13.1754 18.9127 13.47C19.0968 13.7647 19.1147 14.1337 18.9601 14.4448C17.325 17.7352 13.9279 20 10 20C4.47715 20 0 15.5229 0 10C0 4.50107 4.43841 0.038857 9.92838 0.000268937C10.2758 -0.00217271 10.5995 0.175844 10.7836 0.470481ZM8.40989 2.15803C4.75344 2.8954 2 6.12619 2 10C2 14.4183 5.58172 18 10 18C12.587 18 14.8886 16.7721 16.3516 14.8648C11.6131 14.0789 8 9.96139 8 5.00001C8 4.01361 8.1431 3.05953 8.40989 2.15803Z" fill="currentColor"></path></svg> </button> <button type="button" data-header-search-button aria-label="Search the API docs" aria-controls="header-search-overlay" aria-expanded="false" class="text-secondary hover:text-default transition-colors md:inline-flex xl:hidden astro-3ef6ksr2"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4 text-secondary hover:text-default transition-colors astro-3ef6ksr2 " ><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg> </button> <!-- Mobile Menu Button --> <button id="header-drawer-button" type="button" aria-label="Toggle menu" aria-controls="drawer" aria-expanded="false" class="lg:hidden relative right-1 text-secondary hover:text-default transition-colors astro-3ef6ksr2"> <svg width="18" height="10" viewBox="0 0 18 10" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 text-secondary hover:text-default transition-colors astro-3ef6ksr2 " ><path d="M0 1C0 0.447715 0.447715 0 1 0H17C17.5523 0 18 0.447715 18 1C18 1.55228 17.5523 2 17 2H1C0.447715 2 0 1.55228 0 1ZM0 9C0 8.44772 0.447715 8 1 8H11C11.5523 8 12 8.44772 12 9C12 9.55229 11.5523 10 11 10H1C0.447715 10 0 9.55229 0 9Z" fill="currentColor"></path></svg> </button> </div> </div> </header> <div class="fixed inset-x-0 top-16 z-40 hidden h-12 border-b border-primary-surface bg-gray-75 dark:bg-black lg:block astro-s3vzaxny" data-context-subnav data-site-visibility-exclude="chatgpt-docs"> <nav aria-label="API sections" class="flex h-full items-stretch gap-1 overflow-x-auto px-6 whitespace-nowrap lg:justify-center lg:px-8 astro-s3vzaxny"> <a href="/api/docs" aria-current="true" class="group relative flex shrink-0 items-center text-sm font-medium transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-primary-surface text-default astro-s3vzaxny"> <span class="px-2.5 py-1 astro-s3vzaxny">Overview</span> <span class="absolute inset-x-2.5 bottom-0 h-0.5 rounded-t bg-primary-solid astro-s3vzaxny" aria-hidden="true"></span> </a><a href="/api/docs/models" class="group relative flex shrink-0 items-center text-sm font-medium transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-primary-surface text-secondary hover:text-default astro-s3vzaxny"> <span class="px-2.5 py-1 astro-s3vzaxny">Models</span>  </a><a href="/api/docs/guides/agents" class="group relative flex shrink-0 items-center text-sm font-medium transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-primary-surface text-secondary hover:text-default astro-s3vzaxny"> <span class="px-2.5 py-1 astro-s3vzaxny">Agents</span>  </a><a href="/api/docs/guides/tools" class="group relative flex shrink-0 items-center text-sm font-medium transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-primary-surface text-secondary hover:text-default astro-s3vzaxny"> <span class="px-2.5 py-1 astro-s3vzaxny">Tools</span>  </a><a href="/api/docs/guides/realtime" class="group relative flex shrink-0 items-center text-sm font-medium transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-primary-surface text-secondary hover:text-default astro-s3vzaxny"> <span class="px-2.5 py-1 astro-s3vzaxny">Voice &amp; Audio</span>  </a><a href="/api/docs/guides/production-best-practices" class="group relative flex shrink-0 items-center text-sm font-medium transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-primary-surface text-secondary hover:text-default astro-s3vzaxny"> <span class="px-2.5 py-1 astro-s3vzaxny">Production</span>  </a><a href="/api/reference/overview" class="group relative flex shrink-0 items-center text-sm font-medium transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-primary-surface text-secondary hover:text-default astro-s3vzaxny"> <span class="px-2.5 py-1 astro-s3vzaxny">API reference</span>  </a> </nav> </div> <div id="header-search-overlay" role="dialog" aria-modal="true" aria-labelledby="header-search-title" aria-hidden="true" data-open="false" class="fixed inset-0 z-[60] hidden items-start justify-center px-4 pt-20 pb-10 md:px-6 md:pt-24 astro-3ef6ksr2"> <div class="absolute inset-0 bg-black/35 backdrop-blur-xs transition-opacity dark:bg-black/70 astro-3ef6ksr2" data-header-search-dismiss></div> <div class="relative z-10 w-full max-w-4xl overflow-hidden rounded-[28px] bg-surface shadow-[0_36px_120px_-48px_rgba(15,23,42,0.55)] ring-1 ring-black/10 dark:ring-white/10 astro-3ef6ksr2" data-header-search-panel> <div data-header-search-body class="p-0 astro-3ef6ksr2"> <h2 id="header-search-title" class="sr-only astro-3ef6ksr2"> Search the API docs </h2> <div class="relative flex min-h-0 flex-1 flex-col astro-3ef6ksr2"> <button type="button" data-header-search-close aria-label="Close search" class="absolute right-5 top-7 z-20 inline-flex h-8 w-8 shrink-0 appearance-none items-center justify-center rounded-md border-0 bg-transparent p-0 leading-none text-tertiary shadow-none transition-colors hover:text-default focus-visible:outline-none focus-visible:ring-0 md:right-7 astro-3ef6ksr2"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-[18px] w-[18px] shrink-0 astro-3ef6ksr2 " ><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg> </button> <style>astro-island,astro-slot,astro-static-slot{display:contents}</style><script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event("astro:load"));})();</script><script>(()=>{var A=Object.defineProperty;var g=(i,o,a)=>o in i?A(i,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):i[o]=a;var d=(i,o,a)=>g(i,typeof o!="symbol"?o+"":o,a);{let i={0:t=>m(t),1:t=>a(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(a(t)),5:t=>new Set(a(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t),11:t=>Number.POSITIVE_INFINITY*t},o=t=>{let[l,e]=t;return l in i?i[l](e):void 0},a=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([l,e])=>[l,o(e)]));class y extends HTMLElement{constructor(){super(...arguments);d(this,"Component");d(this,"hydrator");d(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let c=this.querySelectorAll("astro-slot"),n={},h=this.querySelectorAll("template[data-astro-template]");for(let r of h){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of c){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("name")||"default"]=r.innerHTML)}let p;try{p=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(s+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${s}`,this.getAttribute("props"),r),r}let u;await this.hydrator(this)(this.Component,p,n,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});d(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),c.disconnect(),this.childrenConnectedCallback()},c=new MutationObserver(()=>{var n;((n=this.lastChild)==null?void 0:n.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});c.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}async start(){let e=JSON.parse(this.getAttribute("opts")),c=this.getAttribute("client");if(Astro[c]===void 0){window.addEventListener(`astro:${c}`,()=>this.start(),{once:!0});return}try{await Astro[c](async()=>{let n=this.getAttribute("renderer-url"),[h,{default:p}]=await Promise.all([import(this.getAttribute("component-url")),n?import(n):()=>()=>{}]),u=this.getAttribute("component-export")||"default";if(!u.includes("."))this.Component=h[u];else{this.Component=h;for(let f of u.split("."))this.Component=this.Component[f]}return this.hydrator=p,this.hydrate},e,this)}catch(n){console.error(`[astro-island] Error hydrating ${this.getAttribute("component-url")}`,n)}}attributeChangedCallback(){this.hydrate()}}d(y,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",y)}})();</script><astro-island uid="11cB0u" prefix="r73" component-url="/_astro/AlgoliaSearch.react.CB6yZoBD.js" component-export="default" renderer-url="/_astro/client.C85L3Gc5.js" props="{&quot;id&quot;:[0,&quot;header-site-search&quot;],&quot;className&quot;:[0,&quot;pagefind-header-ui pagefind-desktop-ui oai-site-search-overlay astro-3ef6ksr2&quot;],&quot;query&quot;:[0,&quot;&quot;],&quot;scope&quot;:[0,&quot;api&quot;],&quot;uiOptions&quot;:[0,{&quot;showImages&quot;:[0,false],&quot;showSubResults&quot;:[0,false],&quot;translations&quot;:[0,{&quot;placeholder&quot;:[0,&quot;Start searching&quot;],&quot;zeroResults&quot;:[0,&quot;No matches yet. Try a different keyword.&quot;]}]}]}" ssr client="load" opts="{&quot;name&quot;:&quot;AlgoliaSearchReact&quot;,&quot;value&quot;:true}" await-children><div id="header-site-search" class="pagefind-header-ui pagefind-desktop-ui oai-site-search-overlay astro-3ef6ksr2 _root_1wztd_1" data-site-search-root="true" data-site-search-provider="algolia" data-site-search-variant="overlay" data-query="" data-scope="api"><div class="flex h-full min-h-0 flex-col gap-0"><div class="shrink-0 border-b border-primary-surface px-4 py-4 md:px-6 md:py-5"><label class="sr-only" for="header-site-search-input">Search docs</label><input id="header-site-search-input" type="text" placeholder="Start searching" autoComplete="off" spellCheck="false" data-site-search-input="true" class="w-full outline-none transition-colors rounded-none border-0 bg-transparent py-0 pl-0 pr-14 text-[18px] leading-tight text-default placeholder:text-tertiary focus:ring-0 md:text-[18px]" value=""/></div><div class="flex min-h-0 flex-1 flex-col gap-4 px-4 py-4 md:px-6 md:py-5"><div data-site-search-empty-state="true" class="flex flex-col gap-4"><section class="_emptySection_1wztd_68" data-site-search-suggestions="true"><h3 class="_emptyHeading_1wztd_74">Suggested</h3><div class="flex flex-wrap gap-2"><button type="button" class="_emptyChip_1wztd_81" data-search-query-button="true" data-search-query="responses create">responses create</button><button type="button" class="_emptyChip_1wztd_81" data-search-query-button="true" data-search-query="reasoning_effort">reasoning_effort</button><button type="button" class="_emptyChip_1wztd_81" data-search-query-button="true" data-search-query="realtime">realtime</button><button type="button" class="_emptyChip_1wztd_81" data-search-query-button="true" data-search-query="prompt caching">prompt caching</button></div></section></div></div></div></div><!--astro:end--></astro-island> </div> </div> </div> </div> <div id="drawer" data-default-tab-id="mobile-nav-tab-1" data-default-search-placeholder="Start searching" data-default-search-scope="api" class="fixed inset-0 z-40 flex flex-col bg-surface transform translate-x-full transition-transform duration-300 lg:hidden astro-3ef6ksr2"> <div class="flex flex-col h-full w-full astro-3ef6ksr2"> <div class="px-6 pt-6 w-full mt-16 astro-3ef6ksr2"> <span id="mobile-nav-primary-label" class="sr-only astro-3ef6ksr2">Primary navigation</span> <div class="flex items-center gap-2 astro-3ef6ksr2"> <nav class="min-w-0 flex-1 flex items-center gap-2 overflow-x-auto pb-2 -mx-1 px-1 astro-3ef6ksr2" role="tablist" aria-labelledby="mobile-nav-primary-label"> <button type="button" role="tab" data-mobile-nav-tab data-tab-id="mobile-nav-tab-1" data-has-nav="true" data-href="/api/docs" data-label="API" data-search-placeholder="Start searching" data-search-scope="api" data-is-active="true" data-selected="true" aria-selected="true" class="shrink-0 rounded-full border border-primary-surface px-3.5 py-1.5 text-sm text-secondary transition-colors duration-150 data-[selected=true]:bg-primary-soft data-[selected=true]:text-default hover:bg-primary-soft-alpha hover:text-default focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-surface astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> API </button><button type="button" role="tab" data-mobile-nav-tab data-tab-id="mobile-nav-tab-2" data-has-nav="true" data-href="https://learn.chatgpt.com/docs" data-label="Codex" data-search-placeholder="Start searching" data-search-scope data-is-active="false" data-selected="false" aria-selected="false" class="shrink-0 rounded-full border border-primary-surface px-3.5 py-1.5 text-sm text-secondary transition-colors duration-150 data-[selected=true]:bg-primary-soft data-[selected=true]:text-default hover:bg-primary-soft-alpha hover:text-default focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-surface astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> Codex </button><button type="button" role="tab" data-mobile-nav-tab data-tab-id="mobile-nav-tab-6" data-has-nav="true" data-href="/chatgpt" data-label="ChatGPT" data-search-placeholder="Start searching" data-search-scope="chatgpt" data-is-active="false" data-selected="false" aria-selected="false" class="shrink-0 rounded-full border border-primary-surface px-3.5 py-1.5 text-sm text-secondary transition-colors duration-150 data-[selected=true]:bg-primary-soft data-[selected=true]:text-default hover:bg-primary-soft-alpha hover:text-default focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-surface astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> ChatGPT </button><button type="button" role="tab" data-mobile-nav-tab data-tab-id="mobile-nav-tab-3" data-has-nav="true" data-href="/codex" data-label="Docs" data-search-placeholder="Start searching" data-search-scope="codex" data-is-active="false" data-selected="false" aria-selected="false" class="shrink-0 rounded-full border border-primary-surface px-3.5 py-1.5 text-sm text-secondary transition-colors duration-150 data-[selected=true]:bg-primary-soft data-[selected=true]:text-default hover:bg-primary-soft-alpha hover:text-default focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-surface astro-3ef6ksr2" data-site-visibility-include="chatgpt-docs"> Docs </button><button type="button" role="tab" data-mobile-nav-tab data-tab-id="mobile-nav-tab-4" data-has-nav="true" data-href="/codex/use-cases" data-label="Use cases" data-search-placeholder="Start searching" data-search-scope="codex" data-is-active="false" data-selected="false" aria-selected="false" class="shrink-0 rounded-full border border-primary-surface px-3.5 py-1.5 text-sm text-secondary transition-colors duration-150 data-[selected=true]:bg-primary-soft data-[selected=true]:text-default hover:bg-primary-soft-alpha hover:text-default focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-surface astro-3ef6ksr2" data-site-visibility-include="chatgpt-docs"> Use cases </button><button type="button" role="tab" data-mobile-nav-tab data-tab-id="mobile-nav-tab-5" data-has-nav="true" data-href="/codex/resources" data-label="Resources" data-search-placeholder="Start searching" data-search-scope="codex" data-is-active="false" data-selected="false" aria-selected="false" class="shrink-0 rounded-full border border-primary-surface px-3.5 py-1.5 text-sm text-secondary transition-colors duration-150 data-[selected=true]:bg-primary-soft data-[selected=true]:text-default hover:bg-primary-soft-alpha hover:text-default focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-surface astro-3ef6ksr2" data-site-visibility-include="chatgpt-docs"> Resources </button><button type="button" role="tab" data-mobile-nav-tab data-tab-id="mobile-nav-tab-7" data-has-nav="true" data-href="/learn" data-label="Resources" data-search-placeholder="Start searching" data-search-scope="learn" data-is-active="false" data-selected="false" aria-selected="false" class="shrink-0 rounded-full border border-primary-surface px-3.5 py-1.5 text-sm text-secondary transition-colors duration-150 data-[selected=true]:bg-primary-soft data-[selected=true]:text-default hover:bg-primary-soft-alpha hover:text-default focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-surface astro-3ef6ksr2" data-site-visibility-exclude="chatgpt-docs"> Resources </button> </nav> <button id="drawer-theme-button" type="button" aria-label="Toggle light and dark theme" class="shrink-0 mb-2 rounded-full border border-primary-surface p-2 text-secondary transition-colors hover:text-default astro-3ef6ksr2"> <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg" class="block dark:hidden w-5 h-5 astro-3ef6ksr2 " ><path fill-rule="evenodd" clip-rule="evenodd" d="M11 0C11.5523 0 12 0.447715 12 1V3C12 3.55228 11.5523 4 11 4C10.4477 4 10 3.55228 10 3V1C10 0.447715 10.4477 0 11 0ZM3.22183 3.22183C3.61235 2.8313 4.24551 2.8313 4.63604 3.22183L6.05025 4.63604C6.44078 5.02656 6.44078 5.65973 6.05025 6.05025C5.65973 6.44078 5.02656 6.44078 4.63604 6.05025L3.22183 4.63604C2.8313 4.24551 2.8313 3.61235 3.22183 3.22183ZM18.7782 3.22183C19.1687 3.61235 19.1687 4.24551 18.7782 4.63604L17.364 6.05025C16.9734 6.44078 16.3403 6.44078 15.9497 6.05025C15.5592 5.65973 15.5592 5.02656 15.9497 4.63604L17.364 3.22183C17.7545 2.8313 18.3876 2.8313 18.7782 3.22183ZM11 8C9.34315 8 8 9.34315 8 11C8 12.6569 9.34315 14 11 14C12.6569 14 14 12.6569 14 11C14 9.34315 12.6569 8 11 8ZM6 11C6 8.23858 8.23858 6 11 6C13.7614 6 16 8.23858 16 11C16 13.7614 13.7614 16 11 16C8.23858 16 6 13.7614 6 11ZM0 11C0 10.4477 0.447715 10 1 10H3C3.55228 10 4 10.4477 4 11C4 11.5523 3.55228 12 3 12H1C0.447715 12 0 11.5523 0 11ZM18 11C18 10.4477 18.4477 10 19 10H21C21.5523 10 22 10.4477 22 11C22 11.5523 21.5523 12 21 12H19C18.4477 12 18 11.5523 18 11ZM6.05025 15.9497C6.44078 16.3403 6.44078 16.9734 6.05025 17.364L4.63604 18.7782C4.24551 19.1687 3.61235 19.1687 3.22183 18.7782C2.8313 18.3876 2.8313 17.7545 3.22183 17.364L4.63604 15.9497C5.02656 15.5592 5.65973 15.5592 6.05025 15.9497ZM15.9497 15.9497C16.3403 15.5592 16.9734 15.5592 17.364 15.9497L18.7782 17.364C19.1687 17.7545 19.1687 18.3876 18.7782 18.7782C18.3877 19.1687 17.7545 19.1687 17.364 18.7782L15.9497 17.364C15.5592 16.9734 15.5592 16.3403 15.9497 15.9497ZM11 18C11.5523 18 12 18.4477 12 19V21C12 21.5523 11.5523 22 11 22C10.4477 22 10 21.5523 10 21V19C10 18.4477 10.4477 18 11 18Z" fill="currentColor"></path></svg> <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" class="hidden dark:block w-5 h-5 astro-3ef6ksr2 " ><path d="M10.7836 0.470481C10.9676 0.765118 10.9855 1.13415 10.8309 1.44525C10.2994 2.51497 10 3.7211 10 5.00001C10 9.41829 13.5817 13 18 13L18.0575 12.9998C18.4049 12.9974 18.7287 13.1754 18.9127 13.47C19.0968 13.7647 19.1147 14.1337 18.9601 14.4448C17.325 17.7352 13.9279 20 10 20C4.47715 20 0 15.5229 0 10C0 4.50107 4.43841 0.038857 9.92838 0.000268937C10.2758 -0.00217271 10.5995 0.175844 10.7836 0.470481ZM8.40989 2.15803C4.75344 2.8954 2 6.12619 2 10C2 14.4183 5.58172 18 10 18C12.587 18 14.8886 16.7721 16.3516 14.8648C11.6131 14.0789 8 9.96139 8 5.00001C8 4.01361 8.1431 3.05953 8.40989 2.15803Z" fill="currentColor"></path></svg> </button> </div> </div> <div class="flex-1 w-full overflow-y-auto px-6 py-4 flex flex-col gap-6 astro-3ef6ksr2" data-mobile-nav-panels> <div data-mobile-search class="astro-3ef6ksr2"> <astro-island uid="2cRGvw" prefix="r74" component-url="/_astro/AlgoliaSearch.react.CB6yZoBD.js" component-export="default" renderer-url="/_astro/client.C85L3Gc5.js" props="{&quot;id&quot;:[0,&quot;header-mobile-search&quot;],&quot;className&quot;:[0,&quot;pagefind-header-ui pagefind-mobile-ui astro-3ef6ksr2&quot;],&quot;query&quot;:[0,&quot;&quot;],&quot;scope&quot;:[0,&quot;api&quot;],&quot;uiOptions&quot;:[0,{&quot;showImages&quot;:[0,false],&quot;showSubResults&quot;:[0,false],&quot;translations&quot;:[0,{&quot;placeholder&quot;:[0,&quot;Start searching&quot;],&quot;zeroResults&quot;:[0,&quot;No matches yet. Try a different keyword.&quot;]}]}]}" ssr client="load" opts="{&quot;name&quot;:&quot;AlgoliaSearchReact&quot;,&quot;value&quot;:true}" await-children><div id="header-mobile-search" class="pagefind-header-ui pagefind-mobile-ui astro-3ef6ksr2 _root_1wztd_1" data-site-search-root="true" data-site-search-provider="algolia" data-site-search-variant="default" data-query="" data-scope="api"><div class="flex h-full min-h-0 flex-col gap-4"><div class=""><label class="sr-only" for="header-mobile-search-input">Search docs</label><input id="header-mobile-search-input" type="text" placeholder="Start searching" autoComplete="off" spellCheck="false" data-site-search-input="true" class="w-full outline-none transition-colors rounded-[18px] border border-transparent bg-primary-soft-alpha py-4 pl-6 pr-14 text-[18px] leading-tight text-default placeholder:text-tertiary focus:border-transparent focus:ring-0" value=""/></div><div class="flex min-h-0 flex-1 flex-col gap-4"><div data-site-search-empty-state="true" class="flex flex-col gap-4"><section class="_emptySection_1wztd_68" data-site-search-suggestions="true"><h3 class="_emptyHeading_1wztd_74">Suggested</h3><div class="flex flex-wrap gap-2"><button type="button" class="_emptyChip_1wztd_81" data-search-query-button="true" data-search-query="responses create">responses create</button><button type="button" class="_emptyChip_1wztd_81" data-search-query-button="true" data-search-query="reasoning_effort">reasoning_effort</button><button type="button" class="_emptyChip_1wztd_81" data-search-query-button="true" data-search-query="realtime">realtime</button><button type="button" class="_emptyChip_1wztd_81" data-search-query-button="true" data-search-query="prompt caching">prompt caching</button></div></section></div></div></div></div><!--astro:end--></astro-island> </div> <div id="mobile-nav-panel-1" data-mobile-nav-content data-tab-id="mobile-nav-tab-1" data-href="/api/docs" data-default-variant-id="mobile-nav-tab-1-variant-0" class="flex flex-col gap-4 pb-8 astro-3ef6ksr2">  <div class="group flex flex-col gap-1 astro-3ef6ksr2" data-mobile-context-options data-context-active="false" data-site-visibility-exclude="chatgpt-docs"> <button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-1-variant-0" data-context-label="Overview" data-context-href="/api/docs" data-context-is-home="true" data-selected="true"> Overview </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-1-variant-1" data-context-label="Models" data-context-href="/api/docs/models" data-context-is-home="false" data-selected="false"> Models </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-1-variant-2" data-context-label="Agents" data-context-href="/api/docs/guides/agents" data-context-is-home="false" data-selected="false"> Agents </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-1-variant-3" data-context-label="Tools" data-context-href="/api/docs/guides/tools" data-context-is-home="false" data-selected="false"> Tools </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-1-variant-4" data-context-label="Voice &#38; Audio" data-context-href="/api/docs/guides/realtime" data-context-is-home="false" data-selected="false"> Voice &amp; Audio </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-1-variant-5" data-context-label="Production" data-context-href="/api/docs/guides/production-best-practices" data-context-is-home="false" data-selected="false"> Production </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-1-variant-6" data-context-label="API reference" data-context-href="/api/reference/overview" data-context-is-home="false" data-selected="false"> API reference </button> </div> <div id="mobile-nav-tab-1-context-select" data-mobile-context-select data-value="mobile-nav-tab-1-variant-0" data-site-visibility-include="chatgpt-docs" class="astro-3ef6ksr2"> <astro-island uid="Z1fJeXo" prefix="r66" component-url="/_astro/MobileContextDropdown.react.DrOpjAP1.js" component-export="default" renderer-url="/_astro/client.C85L3Gc5.js" props="{&quot;rootId&quot;:[0,&quot;mobile-nav-tab-1-context-select&quot;],&quot;initialValue&quot;:[0,&quot;mobile-nav-tab-1-variant-0&quot;],&quot;options&quot;:[1,[[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-1-variant-0&quot;],&quot;label&quot;:[0,&quot;Overview&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-1-variant-1&quot;],&quot;label&quot;:[0,&quot;Models&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-1-variant-2&quot;],&quot;label&quot;:[0,&quot;Agents&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-1-variant-3&quot;],&quot;label&quot;:[0,&quot;Tools&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-1-variant-4&quot;],&quot;label&quot;:[0,&quot;Voice &amp; Audio&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-1-variant-5&quot;],&quot;label&quot;:[0,&quot;Production&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-1-variant-6&quot;],&quot;label&quot;:[0,&quot;API reference&quot;]}]]]}" ssr client="load" opts="{&quot;name&quot;:&quot;MobileContextDropdown&quot;,&quot;value&quot;:true}" await-children><div class="flex min-w-0"><div class="relative max-w-full w-full"><select aria-label="Docs section" class="_NativeSelect_10bwq_299" data-native-selectcontrol=""><option value="mobile-nav-tab-1-variant-0" selected="">Overview</option><option value="mobile-nav-tab-1-variant-1">Models</option><option value="mobile-nav-tab-1-variant-2">Agents</option><option value="mobile-nav-tab-1-variant-3">Tools</option><option value="mobile-nav-tab-1-variant-4">Voice &amp; Audio</option><option value="mobile-nav-tab-1-variant-5">Production</option><option value="mobile-nav-tab-1-variant-6">API reference</option></select><span class="_SelectControl_x887o_1" role="button" tabindex="-1" data-variant="outline" data-block="" data-size="3xl" data-selected="true" aria-disabled="false" id="select-trigger-_r66R_0_" aria-labelledby="_r66R_5H1_ _r66R_5_" aria-hidden="true"><span class="_TriggerText_x887o_510"><span id="_r66R_5H1_" class="sr-only w-full h-0 left-0 bottom-0 pointer-events-none">Docs section</span><span id="_r66R_5_">Overview</span></span><div class="_IndicatorWrapper_x887o_520"><svg width="1em" height="1em" viewBox="0 0 16 9" fill="currentColor" class="_DropdownIcon_x887o_475 _DropdownIconChevron_x887o_586"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L8 6.58579L14.2929 0.292894C14.6834 -0.0976305 15.3166 -0.0976304 15.7071 0.292894C16.0976 0.683418 16.0976 1.31658 15.7071 1.70711L8.70711 8.70711C8.31658 9.09763 7.68342 9.09763 7.29289 8.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z"></path></svg></div></span></div></div><!--astro:end--></astro-island> </div>  <div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-1-variant-0" class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs" class="px-3 py-1.5 rounded-lg transition-colors block text-default bg-primary-ghost-active " data-mobile-nav-link> Home   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Get started </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/quickstart" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Quickstart   </a> </li><li> <a href="/api/docs/guides/latest-model" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Using GPT-5.6   </a> </li><li> <a href="/api/docs/concepts" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Key concepts   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Core concepts </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/migrate-to-responses" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Responses API   </a> </li><li> <a href="/api/docs/guides/conversation-state" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Conversation state   </a> </li><li> <a href="/api/docs/guides/background" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Background mode   </a> </li><li> <a href="/api/docs/guides/streaming-responses" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Streaming   </a> </li><li> <a href="/api/docs/guides/websocket-mode" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> WebSocket mode   </a> </li><li> <a href="/api/docs/guides/responses-multi-agent" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Multi-agent   </a> </li><li> <a href="/api/docs/guides/webhooks" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Webhooks   </a> </li><li> <a href="/api/docs/guides/file-inputs" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> File inputs   </a> </li><li> <a href="/api/docs/guides/compaction" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Compaction   </a> </li><li> <a href="/api/docs/guides/token-counting" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Counting tokens   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> SDKs and CLI </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/libraries" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> OpenAI SDK   </a> </li><li> <a href="/api/docs/libraries/openai-cli" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> OpenAI CLI   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Resources </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/changelog" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Changelog   </a> </li><li> <a href="/api/docs/deprecations" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Deprecations   </a> </li><li> <a href="/api/docs/supported-countries" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Supported countries   </a> </li><li> <a href="/api/docs/bots" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> OpenAI Crawlers   </a> </li><li> <a href="https://openai.com/policies" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Terms and policies  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Legacy APIs </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-2 rounded-lg transition-colors flex items-center justify-between gap-2 hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1">Agent Builder</span> <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block text-secondary transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/agent-builder" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/api/docs/guides/agent-builder/migrate-from-agent-builder" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Migration guide   </a> </li><li> <a href="/api/docs/guides/node-reference" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Node reference   </a> </li><li> <a href="/api/docs/guides/agent-builder-safety" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Safety in building agents   </a> </li> </ul> </details> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-2 rounded-lg transition-colors flex items-center justify-between gap-2 hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1">Evals</span> <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block text-secondary transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/evaluation-getting-started" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Getting started   </a> </li><li> <a href="/api/docs/guides/evals" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Working with evals   </a> </li><li> <a href="/api/docs/guides/prompt-optimizer" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Prompt optimizer   </a> </li><li> <a href="/api/docs/guides/external-models" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> External models   </a> </li><li> <a href="/api/docs/guides/evaluation-best-practices" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Best practices   </a> </li><li> <a href="/api/docs/guides/graders" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Graders   </a> </li> </ul> </details> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-2 rounded-lg transition-colors flex items-center justify-between gap-2 hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1">Fine-tuning</span> <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block text-secondary transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/model-optimization" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Optimization cycle   </a> </li><li> <a href="/api/docs/guides/supervised-fine-tuning" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Supervised fine-tuning   </a> </li><li> <a href="/api/docs/guides/vision-fine-tuning" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Vision fine-tuning   </a> </li><li> <a href="/api/docs/guides/direct-preference-optimization" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Direct preference optimization   </a> </li><li> <a href="/api/docs/guides/reinforcement-fine-tuning" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Reinforcement fine-tuning   </a> </li><li> <a href="/api/docs/guides/rft-use-cases" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> RFT use cases   </a> </li><li> <a href="/api/docs/guides/fine-tuning-best-practices" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Best practices   </a> </li> </ul> </details> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-2 rounded-lg transition-colors flex items-center justify-between gap-2 hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1">Assistants API</span> <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block text-secondary transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/assistants/migration" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Migration guide   </a> </li><li> <a href="/api/docs/assistants/deep-dive" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Deep dive   </a> </li><li> <a href="/api/docs/assistants/tools" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Tools   </a> </li> </ul> </details> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-1-variant-1" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/models" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Model catalog   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Choose a model </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/pricing" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Pricing   </a> </li><li> <a href="/api/docs/guides/model-selection" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Model selection   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Text and code </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/text" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Text generation   </a> </li><li> <a href="/api/docs/guides/code-generation" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Code generation   </a> </li><li> <a href="/api/docs/guides/structured-outputs" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Structured output   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Prompting </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/prompting" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/api/docs/guides/prompt-engineering" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Prompt engineering   </a> </li><li> <a href="/api/docs/guides/citation-formatting" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Citation formatting   </a> </li><li> <a href="/api/docs/guides/prompting/migrate-from-prompt-object" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Migration guide   </a> </li><li> <a href="/api/docs/guides/prompt-generation" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Prompt generation   </a> </li><li> <a href="/api/docs/guides/frontend-prompt" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Frontend prompting   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Reasoning </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/reasoning" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Reasoning models   </a> </li><li> <a href="/api/docs/guides/reasoning-best-practices" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Reasoning best practices   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Images and video </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/images-vision" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Images and vision   </a> </li><li> <a href="/api/docs/guides/image-generation" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Image generation   </a> </li><li> <a href="/api/docs/guides/video-generation" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Video generation   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Realtime and audio </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/audio" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Audio and speech   </a> </li><li> <a href="/api/docs/guides/realtime" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/api/docs/guides/voice-agents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Voice agents   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Specialized models </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/deep-research" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Deep research   </a> </li><li> <a href="/api/docs/guides/embeddings" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Embeddings   </a> </li><li> <a href="/api/docs/guides/moderation" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Moderation   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-1-variant-2" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/agents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Agents SDK </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/agents/quickstart" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Quickstart   </a> </li><li> <a href="/api/docs/guides/agents/define-agents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Agent definitions   </a> </li><li> <a href="/api/docs/guides/agents/models" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Models and providers   </a> </li><li> <a href="/api/docs/guides/agents/running-agents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Running agents   </a> </li><li> <a href="/api/docs/guides/agents/sandboxes" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Sandbox agents   </a> </li><li> <a href="/api/docs/guides/agents/orchestration" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Orchestration   </a> </li><li> <a href="/api/docs/guides/agents/guardrails-approvals" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Guardrails   </a> </li><li> <a href="/api/docs/guides/agents/results" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Results and state   </a> </li><li> <a href="/api/docs/guides/agents/integrations-observability" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Integrations and observability   </a> </li><li> <a href="/api/docs/guides/agent-evals" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Evaluate agent workflows   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> ChatKit </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/chatkit" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/api/docs/guides/chatkit-themes" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Customize   </a> </li><li> <a href="/api/docs/guides/chatkit-widgets" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Widgets   </a> </li><li> <a href="/api/docs/guides/chatkit-actions" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Actions   </a> </li><li> <a href="/api/docs/guides/custom-chatkit" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Advanced integrations   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-1-variant-3" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/tools" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/api/docs/guides/function-calling" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Function calling   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Search and retrieval </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/tools-web-search" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Web search   </a> </li><li> <a href="/api/docs/guides/tools-file-search" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> File search   </a> </li><li> <a href="/api/docs/guides/retrieval" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Retrieval   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Connect tools and data </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/tools-connectors-mcp" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> MCP and Connectors   </a> </li><li> <a href="/api/docs/guides/secure-mcp-tunnels" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Secure MCP Tunnel   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Build tool workflows </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/tools-skills" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Skills   </a> </li><li> <a href="/api/docs/guides/tools-tool-search" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Tool search   </a> </li><li> <a href="/api/docs/guides/tools-programmatic-tool-calling" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Programmatic tool calling   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Computer and code </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/tools-shell" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Shell   </a> </li><li> <a href="/api/docs/guides/tools-computer-use" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Computer use   </a> </li><li> <a href="/api/docs/guides/tools-apply-patch" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Apply Patch   </a> </li><li> <a href="/api/docs/guides/tools-local-shell" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Local shell   </a> </li><li> <a href="/api/docs/guides/tools-code-interpreter" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Code interpreter   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Media </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/tools-image-generation" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Image generation   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-1-variant-4" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/realtime" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Get started </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/voice-agents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Voice agents   </a> </li><li> <a href="/api/docs/guides/realtime-translation" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Live translation   </a> </li><li> <a href="/api/docs/guides/realtime-models-prompting" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Realtime prompting guide   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Audio </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/audio" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Audio and speech   </a> </li><li> <a href="/api/docs/guides/realtime-transcription" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Realtime transcription   </a> </li><li> <a href="/api/docs/guides/speech-to-text" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Speech to text   </a> </li><li> <a href="/api/docs/guides/text-to-speech" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Speech generation   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Connection methods </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/realtime-webrtc" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> WebRTC   </a> </li><li> <a href="/api/docs/guides/realtime-websocket" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> WebSocket   </a> </li><li> <a href="/api/docs/guides/realtime-sip" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> SIP   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Sessions and operations </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/realtime-conversations" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Managing conversations   </a> </li><li> <a href="/api/docs/guides/realtime-vad" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Voice activity detection   </a> </li><li> <a href="/api/docs/guides/realtime-mcp" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Realtime with tools   </a> </li><li> <a href="/api/docs/guides/realtime-server-controls" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Webhooks and server-side controls   </a> </li><li> <a href="/api/docs/guides/realtime-costs" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Managing costs   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-1-variant-5" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Go live </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/production-best-practices" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Production best practices   </a> </li><li> <a href="/api/docs/guides/deployment-checklist" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Deployment checklist   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Performance and quality </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/latency-optimization" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Latency optimization   </a> </li><li> <a href="/api/docs/guides/predicted-outputs" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Predicted Outputs   </a> </li><li> <a href="/api/docs/guides/priority-processing" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Priority processing   </a> </li><li> <a href="/api/docs/guides/optimizing-llm-accuracy" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Accuracy optimization   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Cost and throughput </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/cost-optimization" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Cost optimization   </a> </li><li> <a href="/api/docs/guides/prompt-caching" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Prompt caching   </a> </li><li> <a href="/api/docs/guides/batch" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Batch   </a> </li><li> <a href="/api/docs/guides/flex-processing" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Flex processing   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Safety and governance </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/safety-best-practices" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Safety best practices   </a> </li><li> <a href="/api/docs/guides/red-teaming" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Red teaming   </a> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-2 rounded-lg transition-colors flex items-center justify-between gap-2 hover:text-default hover:bg-primary-ghost-hover"> <a href="/api/docs/guides/safety-checks" class="flex-1 " data-mobile-nav-link> Safety checks  </a> <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block text-secondary transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/safety-checks/cybersecurity" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Cybersecurity checks   </a> </li><li> <a href="/api/docs/guides/safety-checks/under-18-api-guidance" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Under 18 API Guidance   </a> </li> </ul> </details> </li><li> <a href="/api/docs/guides/your-data" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Your data   </a> </li><li> <a href="/api/docs/guides/rbac" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Permissions   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Infrastructure and access </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/private-link" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Private Link   </a> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-2 rounded-lg transition-colors flex items-center justify-between gap-2 hover:text-default hover:bg-primary-ghost-hover"> <a href="/api/docs/guides/workload-identity-federation" class="flex-1 " data-mobile-nav-link> Workload identity federation  </a> <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block text-secondary transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/workload-identity-federation/kubernetes" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Kubernetes   </a> </li><li> <a href="/api/docs/guides/workload-identity-federation/aws" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> AWS   </a> </li><li> <a href="/api/docs/guides/workload-identity-federation/microsoft-azure" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Microsoft Azure   </a> </li><li> <a href="/api/docs/guides/workload-identity-federation/google-cloud" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Google Cloud   </a> </li><li> <a href="/api/docs/guides/workload-identity-federation/github-actions" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> GitHub Actions   </a> </li><li> <a href="/api/docs/guides/workload-identity-federation/spiffe" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> SPIFFE   </a> </li> </ul> </details> </li><li> <a href="/api/docs/guides/ip-addresses" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> IP egress ranges   </a> </li><li> <a href="/api/docs/guides/amazon-bedrock" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Amazon Bedrock   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Operations </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/api/docs/guides/rate-limits" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Rate limits   </a> </li><li> <a href="/api/docs/guides/admin-apis" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Admin APIs   </a> </li><li> <a href="/api/docs/guides/error-codes" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Error codes   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-1-variant-6" hidden class="flex flex-col gap-6 astro-3ef6ksr2">  </div> </div><div id="mobile-nav-panel-2" data-mobile-nav-content data-tab-id="mobile-nav-tab-2" data-href="https://learn.chatgpt.com/docs" data-default-variant-id="mobile-nav-tab-2-variant-0" hidden class="flex flex-col gap-4 pb-8 astro-3ef6ksr2">  <div class="group flex flex-col gap-1 astro-3ef6ksr2" data-mobile-context-options data-context-active="false" data-site-visibility-exclude="chatgpt-docs"> <a href="https://learn.chatgpt.com/docs" target="_blank" rel="noopener noreferrer" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default astro-3ef6ksr2" data-mobile-nav-link> Docs </a><a href="https://learn.chatgpt.com/use-cases" target="_blank" rel="noopener noreferrer" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default astro-3ef6ksr2" data-mobile-nav-link> Use cases </a> </div> <div id="mobile-nav-tab-2-context-select" data-mobile-context-select data-value="mobile-nav-tab-2-variant-0" data-site-visibility-include="chatgpt-docs" class="astro-3ef6ksr2"> <astro-island uid="Z19EMU8" prefix="r67" component-url="/_astro/MobileContextDropdown.react.DrOpjAP1.js" component-export="default" renderer-url="/_astro/client.C85L3Gc5.js" props="{&quot;rootId&quot;:[0,&quot;mobile-nav-tab-2-context-select&quot;],&quot;initialValue&quot;:[0,&quot;mobile-nav-tab-2-variant-0&quot;],&quot;options&quot;:[1,[[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-2-variant-0&quot;],&quot;label&quot;:[0,&quot;Docs&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-2-variant-1&quot;],&quot;label&quot;:[0,&quot;Use cases&quot;]}]]]}" ssr client="load" opts="{&quot;name&quot;:&quot;MobileContextDropdown&quot;,&quot;value&quot;:true}" await-children><div class="flex min-w-0"><div class="relative max-w-full w-full"><select aria-label="Docs section" class="_NativeSelect_10bwq_299" data-native-selectcontrol=""><option value="mobile-nav-tab-2-variant-0" selected="">Docs</option><option value="mobile-nav-tab-2-variant-1">Use cases</option></select><span class="_SelectControl_x887o_1" role="button" tabindex="-1" data-variant="outline" data-block="" data-size="3xl" data-selected="true" aria-disabled="false" id="select-trigger-_r67R_0_" aria-labelledby="_r67R_5H1_ _r67R_5_" aria-hidden="true"><span class="_TriggerText_x887o_510"><span id="_r67R_5H1_" class="sr-only w-full h-0 left-0 bottom-0 pointer-events-none">Docs section</span><span id="_r67R_5_">Docs</span></span><div class="_IndicatorWrapper_x887o_520"><svg width="1em" height="1em" viewBox="0 0 16 9" fill="currentColor" class="_DropdownIcon_x887o_475 _DropdownIconChevron_x887o_586"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L8 6.58579L14.2929 0.292894C14.6834 -0.0976305 15.3166 -0.0976304 15.7071 0.292894C16.0976 0.683418 16.0976 1.31658 15.7071 1.70711L8.70711 8.70711C8.31658 9.09763 7.68342 9.09763 7.29289 8.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z"></path></svg></div></span></div></div><!--astro:end--></astro-island> </div>  <div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-2-variant-0" class="flex flex-col gap-6 astro-3ef6ksr2">  </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-2-variant-1" hidden class="flex flex-col gap-6 astro-3ef6ksr2">  </div> </div><div id="mobile-nav-panel-6" data-mobile-nav-content data-tab-id="mobile-nav-tab-6" data-href="/chatgpt" data-default-variant-id="mobile-nav-tab-6-variant-0" hidden class="flex flex-col gap-4 pb-8 astro-3ef6ksr2">  <div class="group flex flex-col gap-1 astro-3ef6ksr2" data-mobile-context-options data-context-active="false" data-site-visibility-exclude="chatgpt-docs"> <button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-6-variant-1" data-context-label="Apps SDK" data-context-href="/apps-sdk" data-context-is-home="false" data-selected="false"> Apps SDK </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-6-variant-2" data-context-label="Workspace Agents" data-context-href="/workspace-agents" data-context-is-home="false" data-selected="false"> Workspace Agents </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-6-variant-3" data-context-label="Commerce" data-context-href="/commerce" data-context-is-home="false" data-selected="false"> Commerce </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-6-variant-4" data-context-label="Ads" data-context-href="/ads" data-context-is-home="false" data-selected="false"> Ads </button> </div> <div id="mobile-nav-tab-6-context-select" data-mobile-context-select data-value="mobile-nav-tab-6-variant-0" data-site-visibility-include="chatgpt-docs" class="astro-3ef6ksr2"> <astro-island uid="25hOsg" prefix="r68" component-url="/_astro/MobileContextDropdown.react.DrOpjAP1.js" component-export="default" renderer-url="/_astro/client.C85L3Gc5.js" props="{&quot;rootId&quot;:[0,&quot;mobile-nav-tab-6-context-select&quot;],&quot;initialValue&quot;:[0,&quot;mobile-nav-tab-6-variant-0&quot;],&quot;options&quot;:[1,[[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-6-variant-1&quot;],&quot;label&quot;:[0,&quot;Apps SDK&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-6-variant-2&quot;],&quot;label&quot;:[0,&quot;Workspace Agents&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-6-variant-3&quot;],&quot;label&quot;:[0,&quot;Commerce&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-6-variant-4&quot;],&quot;label&quot;:[0,&quot;Ads&quot;]}]]]}" ssr client="load" opts="{&quot;name&quot;:&quot;MobileContextDropdown&quot;,&quot;value&quot;:true}" await-children><div class="flex min-w-0"><div class="relative max-w-full w-full"><select aria-label="Docs section" class="_NativeSelect_10bwq_299" data-native-selectcontrol=""><option value="mobile-nav-tab-6-variant-1">Apps SDK</option><option value="mobile-nav-tab-6-variant-2">Workspace Agents</option><option value="mobile-nav-tab-6-variant-3">Commerce</option><option value="mobile-nav-tab-6-variant-4">Ads</option></select><span class="_SelectControl_x887o_1" role="button" tabindex="-1" data-variant="outline" data-block="" data-size="3xl" data-selected="true" aria-disabled="false" id="select-trigger-_r68R_0_" aria-labelledby="_r68R_5H1_ _r68R_5_" aria-hidden="true"><span class="_TriggerText_x887o_510"><span id="_r68R_5H1_" class="sr-only w-full h-0 left-0 bottom-0 pointer-events-none">Docs section</span><span id="_r68R_5_">Select...</span></span><div class="_IndicatorWrapper_x887o_520"><svg width="1em" height="1em" viewBox="0 0 16 9" fill="currentColor" class="_DropdownIcon_x887o_475 _DropdownIconChevron_x887o_586"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L8 6.58579L14.2929 0.292894C14.6834 -0.0976305 15.3166 -0.0976304 15.7071 0.292894C16.0976 0.683418 16.0976 1.31658 15.7071 1.70711L8.70711 8.70711C8.31658 9.09763 7.68342 9.09763 7.29289 8.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z"></path></svg></div></span></div></div><!--astro:end--></astro-island> </div>  <div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-6-variant-0" class="flex flex-col gap-6 astro-3ef6ksr2">  </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-6-variant-1" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/apps-sdk" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Home   </a> </li><li> <a href="/apps-sdk/quickstart" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Quickstart   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Core Concepts </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/apps-sdk/mcp-apps-in-chatgpt" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> MCP Apps in ChatGPT   </a> </li><li> <a href="/apps-sdk/concepts/mcp-server" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> MCP Server   </a> </li><li> <a href="/apps-sdk/concepts/ux-principles" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> UX principles   </a> </li><li> <a href="/apps-sdk/concepts/ui-guidelines" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> UI guidelines   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Plan </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/apps-sdk/plan/use-case" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Research use cases   </a> </li><li> <a href="/apps-sdk/plan/tools" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Define tools   </a> </li><li> <a href="/apps-sdk/plan/components" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Design components   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Build </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/apps-sdk/build/mcp-server" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Set up your server   </a> </li><li> <a href="/apps-sdk/build/chatgpt-ui" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Build your ChatGPT UI   </a> </li><li> <a href="/apps-sdk/build/auth" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Authenticate users   </a> </li><li> <a href="/apps-sdk/build/state-management" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Manage state   </a> </li><li> <a href="/apps-sdk/build/monetization" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Monetize your app   </a> </li><li> <a href="/apps-sdk/build/examples" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Examples   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Deploy </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/apps-sdk/deploy" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Deploy your app   </a> </li><li> <a href="/apps-sdk/deploy/connect-chatgpt" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Connect from ChatGPT   </a> </li><li> <a href="/apps-sdk/deploy/testing" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Test your integration   </a> </li><li> <a href="/apps-sdk/deploy/submission" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Prepare your app   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Conversion apps </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/apps-sdk/guides/restaurant-reservation-conversion-spec" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Restaurant reservation spec   </a> </li><li> <a href="/apps-sdk/guides/product-checkout-conversion-spec" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Product checkout spec   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Guides </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/apps-sdk/guides/optimize-metadata" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Optimize Metadata   </a> </li><li> <a href="/apps-sdk/guides/security-privacy" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Security &amp; Privacy   </a> </li><li> <a href="/apps-sdk/deploy/troubleshooting" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Troubleshooting   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Resources </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/apps-sdk/changelog" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Changelog   </a> </li><li> <a href="/apps-sdk/app-guidelines" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> App guidelines   </a> </li><li> <a href="/apps-sdk/reference" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Reference   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-6-variant-2" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/workspace-agents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Home   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Get started </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/workspace-agents/trigger-runs" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Trigger workspace agent runs   </a> </li><li> <a href="/workspace-agents/authentication" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Authenticate with Workspace Agent access tokens   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-6-variant-3" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/commerce" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Home   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Guides </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/commerce/guides/get-started" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Get started   </a> </li><li> <a href="/commerce/guides/best-practices" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Best practices   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> File Upload </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/commerce/specs/file-upload/overview" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/commerce/specs/file-upload/products" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Products   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> API </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/commerce/specs/api/overview" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/commerce/specs/api/feeds" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Feeds   </a> </li><li> <a href="/commerce/specs/api/products" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Products   </a> </li><li> <a href="/commerce/specs/api/promotions" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Promotions   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-6-variant-4" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/ads" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Ads Overview   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Measurement </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/ads/measurement-pixel" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> JavaScript Pixel   </a> </li><li> <a href="/ads/image-tag" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Image tag   </a> </li><li> <a href="/ads/conversions-api" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Conversions API   </a> </li><li> <a href="/ads/supported-events" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Supported events   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Advertiser API </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/ads/api-overview" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/ads/api-partner-setup" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> API partner setup   </a> </li><li> <a href="/ads/api-quickstart" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Quickstart   </a> </li><li> <a href="/ads/product-feeds" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Product feeds   </a> </li><li> <a href="/ads/campaign-targeting" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Campaign Targeting   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> API Reference </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/ads/api-reference/authentication" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Authentication   </a> </li><li> <a href="/ads/api-reference/conversion-setup" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Conversion setup   </a> </li><li> <a href="/ads/api-reference/campaigns" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Campaigns   </a> </li><li> <a href="/ads/api-reference/ad-groups" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Ad Groups   </a> </li><li> <a href="/ads/api-reference/ads" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Ads   </a> </li><li> <a href="/ads/api-reference/ad-account" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Ad Account   </a> </li><li> <a href="/ads/api-reference/insights" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Insights   </a> </li><li> <a href="/ads/api-reference/files" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Files   </a> </li> </ul> </div> </div> </div><div id="mobile-nav-panel-3" data-mobile-nav-content data-tab-id="mobile-nav-tab-3" data-href="/codex" data-default-variant-id="mobile-nav-tab-3-variant-0" hidden class="flex flex-col gap-4 pb-8 astro-3ef6ksr2">  <div class="group flex flex-col gap-1 astro-3ef6ksr2" data-mobile-context-options data-context-active="false" data-site-visibility-exclude="chatgpt-docs"> <button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-3-variant-0" data-context-label="Overview" data-context-href="/codex" data-context-is-home="true" data-selected="true"> Overview </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-3-variant-1" data-context-label="Features" data-context-href="/codex/features" data-context-is-home="false" data-selected="false"> Features </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-3-variant-2" data-context-label="Configuration" data-context-href="/codex/configuration" data-context-is-home="false" data-selected="false"> Configuration </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-3-variant-3" data-context-label="Developers" data-context-href="/codex/developers" data-context-is-home="false" data-selected="false"> Developers </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-3-variant-4" data-context-label="Security" data-context-href="/codex/security-administration" data-context-is-home="false" data-selected="false"> Security </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-3-variant-5" data-context-label="Administration" data-context-href="/codex/administration" data-context-is-home="false" data-selected="false"> Administration </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-3-variant-6" data-context-label="Use Cases" data-context-href="/codex/use-cases" data-context-is-home="false" data-selected="false" data-site-visibility-exclude="chatgpt-docs"> Use Cases </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-3-variant-7" data-context-label="Resources" data-context-href="/codex/resources" data-context-is-home="false" data-selected="false" data-site-visibility-exclude="chatgpt-docs"> Resources </button> </div> <div id="mobile-nav-tab-3-context-select" data-mobile-context-select data-value="mobile-nav-tab-3-variant-0" data-site-visibility-include="chatgpt-docs" class="astro-3ef6ksr2"> <astro-island uid="nmLwU" prefix="r69" component-url="/_astro/MobileContextDropdown.react.DrOpjAP1.js" component-export="default" renderer-url="/_astro/client.C85L3Gc5.js" props="{&quot;rootId&quot;:[0,&quot;mobile-nav-tab-3-context-select&quot;],&quot;initialValue&quot;:[0,&quot;mobile-nav-tab-3-variant-0&quot;],&quot;options&quot;:[1,[[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-3-variant-0&quot;],&quot;label&quot;:[0,&quot;Overview&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-3-variant-1&quot;],&quot;label&quot;:[0,&quot;Features&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-3-variant-2&quot;],&quot;label&quot;:[0,&quot;Configuration&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-3-variant-3&quot;],&quot;label&quot;:[0,&quot;Developers&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-3-variant-4&quot;],&quot;label&quot;:[0,&quot;Security&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-3-variant-5&quot;],&quot;label&quot;:[0,&quot;Administration&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-3-variant-6&quot;],&quot;label&quot;:[0,&quot;Use Cases&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-3-variant-7&quot;],&quot;label&quot;:[0,&quot;Resources&quot;]}]]]}" ssr client="load" opts="{&quot;name&quot;:&quot;MobileContextDropdown&quot;,&quot;value&quot;:true}" await-children><div class="flex min-w-0"><div class="relative max-w-full w-full"><select aria-label="Docs section" class="_NativeSelect_10bwq_299" data-native-selectcontrol=""><option value="mobile-nav-tab-3-variant-0" selected="">Overview</option><option value="mobile-nav-tab-3-variant-1">Features</option><option value="mobile-nav-tab-3-variant-2">Configuration</option><option value="mobile-nav-tab-3-variant-3">Developers</option><option value="mobile-nav-tab-3-variant-4">Security</option><option value="mobile-nav-tab-3-variant-5">Administration</option><option value="mobile-nav-tab-3-variant-6">Use Cases</option><option value="mobile-nav-tab-3-variant-7">Resources</option></select><span class="_SelectControl_x887o_1" role="button" tabindex="-1" data-variant="outline" data-block="" data-size="3xl" data-selected="true" aria-disabled="false" id="select-trigger-_r69R_0_" aria-labelledby="_r69R_5H1_ _r69R_5_" aria-hidden="true"><span class="_TriggerText_x887o_510"><span id="_r69R_5H1_" class="sr-only w-full h-0 left-0 bottom-0 pointer-events-none">Docs section</span><span id="_r69R_5_">Overview</span></span><div class="_IndicatorWrapper_x887o_520"><svg width="1em" height="1em" viewBox="0 0 16 9" fill="currentColor" class="_DropdownIcon_x887o_475 _DropdownIconChevron_x887o_586"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L8 6.58579L14.2929 0.292894C14.6834 -0.0976305 15.3166 -0.0976304 15.7071 0.292894C16.0976 0.683418 16.0976 1.31658 15.7071 1.70711L8.70711 8.70711C8.31658 9.09763 7.68342 9.09763 7.29289 8.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z"></path></svg></div></span></div></div><!--astro:end--></astro-island> </div>  <div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-3-variant-0" class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Home   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Get started </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/quickstart" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Quickstart   </a> </li><li> <a href="/codex/use-chatgpt" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Use ChatGPT   </a> </li><li> <a href="/codex/get-started-with-work" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Get started with Work   </a> </li><li> <a href="/codex/import" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Import from another agent   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Foundations </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/prompting" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Prompting   </a> </li><li> <a href="/codex/personalize" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Personalize ChatGPT   </a> </li><li> <a href="/codex/skills-and-plugins" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Skills &amp; Plugins   </a> </li><li> <a href="/codex/permission-modes" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Permissions   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Explore </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/whats-new" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> What&#39;s new   </a> </li><li> <a href="/codex/models" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Models   </a> </li><li> <a href="/codex/pricing" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Pricing   </a> </li><li> <a href="/codex/glossary" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Glossary   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Available on </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/app" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> ChatGPT desktop app   </a> </li><li> <a href="/codex/web" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> ChatGPT on the web   </a> </li><li> <a href="/codex/cli" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex CLI   </a> </li><li> <a href="/codex/ide" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex IDE extension   </a> </li><li> <a href="/codex/cloud" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex cloud   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Releases </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/changelog" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Changelog   </a> </li><li> <a href="/codex/feature-maturity" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Feature Maturity   </a> </li><li> <a href="/codex/open-source" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Open Source   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-3-variant-1" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/features" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Workflows </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/projects" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Projects and chats   </a> </li><li> <a href="/codex/sites" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Sites   </a> </li><li> <a href="/codex/visualizations" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Visualizations   </a> </li><li> <a href="/codex/automations" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Scheduled tasks   </a> </li><li> <a href="/codex/long-running-work" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Long-running work   </a> </li><li> <a href="/codex/notifications" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Notifications   </a> </li><li> <a href="/codex/pets" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Pets   </a> </li><li> <a href="/codex/features/codex-micro" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex Micro   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Capabilities </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/browser" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Browser   </a> </li><li> <a href="/codex/computer-use" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Computer use   </a> </li><li> <a href="/codex/plugins" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Plugins   </a> </li><li> <a href="/codex/web-search" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Web search   </a> </li><li> <a href="/codex/image-generation" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Image generation   </a> </li><li> <a href="/codex/image-inputs" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Image inputs   </a> </li><li> <a href="/codex/appshots" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Appshots   </a> </li><li> <a href="/codex/chrome-extension" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Chrome extension   </a> </li><li> <a href="/codex/artifacts-viewer" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Work with files   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Reference </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/reference/commands" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Commands   </a> </li><li> <a href="/codex/reference/slash-commands" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Slash commands   </a> </li><li> <a href="/codex/reference/settings" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Settings   </a> </li><li> <a href="/codex/reference/troubleshooting" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Troubleshooting   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-3-variant-2" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/configuration" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Customization </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/customization/overview" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/codex/customization/memories" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Memories   </a> </li><li> <a href="/codex/customization/chronicle" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Chronicle   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Config file </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/config-file/config-basic" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Config Basics   </a> </li><li> <a href="/codex/config-file/config-advanced" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Advanced Config   </a> </li><li> <a href="/codex/config-file/config-reference" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Config Reference   </a> </li><li> <a href="/codex/config-file/environment-variables" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Environment Variables   </a> </li><li> <a href="/codex/config-file/config-sample" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Sample Config   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Agent configuration </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/agent-configuration/agents-md" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> AGENTS.md   </a> </li><li> <a href="/codex/agent-configuration/subagents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Subagents   </a> </li><li> <a href="/codex/agent-configuration/speed" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Speed   </a> </li><li> <a href="/codex/agent-configuration/rules" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Rules   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Extend ChatGPT and Codex </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/extend/record-and-replay" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Record &amp; Replay   </a> </li><li> <a href="/codex/extend/mcp" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> MCP   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Windows </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/windows/windows-app" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Desktop app   </a> </li><li> <a href="/codex/windows/windows-sandbox" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Windows sandbox   </a> </li><li> <a href="/codex/windows/wsl" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> WSL   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-3-variant-3" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/developers" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Development workflows </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/code-review" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Code review   </a> </li><li> <a href="/codex/integrated-terminal" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Integrated terminal   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Extend and automate </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/build-skills" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Build skills   </a> </li><li> <a href="/codex/build-plugins" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Build plugins   </a> </li><li> <a href="/codex/build-app" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Build an app   </a> </li><li> <a href="/codex/submit-plugins" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Submit plugins   </a> </li><li> <a href="/codex/hooks" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Hooks   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Environments </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/environments/modes" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Modes   </a> </li><li> <a href="/codex/environments/local-environment" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Local environments   </a> </li><li> <a href="/codex/environments/cloud-environment" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Cloud environment   </a> </li><li> <a href="/codex/environments/git-worktrees" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Git worktrees   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Build with Codex </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/codex-sdk" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex SDK   </a> </li><li> <a href="/codex/app-server" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> App Server   </a> </li><li> <a href="/codex/mcp-server" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> MCP Server   </a> </li><li> <a href="/codex/github-action" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> GitHub Action   </a> </li><li> <a href="/codex/non-interactive-mode" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Non-interactive mode   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Third-party integrations </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/third-party/github" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> GitHub   </a> </li><li> <a href="/codex/third-party/slack" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Slack   </a> </li><li> <a href="/codex/third-party/linear" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Linear   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Reference </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/cli-customization" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> CLI customization   </a> </li><li> <a href="/codex/developer-commands" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Developer commands   </a> </li><li> <a href="/codex/developer-settings" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Developer settings   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-3-variant-4" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/security-administration" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Permissions </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/permissions" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Profiles   </a> </li><li> <a href="/codex/sandboxing" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Sandboxing   </a> </li><li> <a href="/codex/sandboxing/auto-review" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Auto-review   </a> </li><li> <a href="/codex/agent-approvals-security" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Agent approvals &amp; security   </a> </li><li> <a href="/codex/cloud/internet-access" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Internet access   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Codex Security </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/security" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li><li> <a href="/codex/security/faq" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Cloud FAQ   </a> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-2 rounded-lg transition-colors flex items-center justify-between gap-2 hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1">Codex Security plugin</span> <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block text-secondary transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/security/plugin" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Quickstart   </a> </li><li> <a href="/codex/security/plugin/scans" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Run a security scan   </a> </li><li> <a href="/codex/security/plugin/deep-scans" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Run a deep scan   </a> </li><li> <a href="/codex/security/plugin/code-changes" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Review code changes   </a> </li><li> <a href="/codex/security/plugin/triage-backlog" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Triage a backlog   </a> </li><li> <a href="/codex/security/plugin/fix-findings" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Fix findings   </a> </li><li> <a href="/codex/security/plugin/export-findings" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Export and track findings   </a> </li><li> <a href="/codex/security/plugin/vulnerability-reports" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Write vulnerability reports   </a> </li><li> <a href="/codex/security/plugin/security-hardening" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Propose security hardening   </a> </li><li> <a href="/codex/security/plugin/changelog" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Changelog   </a> </li> </ul> </details> </li><li> <a href="/codex/security/setup" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex Security cloud setup   </a> </li><li> <a href="/codex/security/threat-model" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Improving the threat model   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Safety </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/cyber-safety" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Cyber Safety   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-3-variant-5" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/administration" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Overview   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Getting started </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/enterprise/admin-setup" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Admin rollout guide   </a> </li><li> <a href="/codex/enterprise/work-admin-faq" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Work mode admin FAQ   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Identity and authentication </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/auth" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Authentication overview   </a> </li><li> <a href="/codex/enterprise/access-tokens" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Access tokens   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Workspace access, policy, and models </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/enterprise/groups-and-provisioning" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Groups and provisioning   </a> </li><li> <a href="/codex/enterprise/roles-and-workspace-permissions" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Roles and workspace permissions   </a> </li><li> <a href="/codex/enterprise/managed-configuration" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Managed configuration   </a> </li><li> <a href="/codex/hipaa-configuration" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> HIPAA configuration   </a> </li><li> <a href="/codex/enterprise/workspace-model-availability" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Workspace model availability   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Plugin and connector controls </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/enterprise/apps-and-connectors" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Plugin controls   </a> </li><li> <a href="/codex/enterprise/skills" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Skill controls   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Usage, governance, and compliance </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/enterprise/governance" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Governance   </a> </li><li> <a href="/codex/enterprise/workspace-analytics" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Workspace analytics   </a> </li><li> <a href="/codex/enterprise/analytics-api" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Analytics API   </a> </li><li> <a href="/codex/enterprise/compliance-api" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Compliance API and audit events   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Deployment and model providers </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/enterprise/windows-deployment" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Windows app deployment   </a> </li><li> <a href="/codex/remote-connections" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Remote connections   </a> </li><li> <a href="/codex/amazon-bedrock" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Amazon Bedrock   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-3-variant-6" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/use-cases" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Explore use cases   </a> </li><li> <a href="/codex/use-cases/collections" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Collections   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-3-variant-7" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/resources" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Home   </a> </li><li> <a href="/codex/videos" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Videos   </a> </li><li> <a href="https://developers.openai.com/showcase" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Showcase  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://openai.com/academy/" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> OpenAI Academy  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://academy.openai.com/home/events" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Online trainings  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Community </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="https://developers.openai.com/community/codex-ambassadors" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Codex Ambassadors  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://developers.openai.com/community/students" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Codex for Students  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://developers.openai.com/community/codex-for-oss" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Codex for Open Source  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://developers.openai.com/community/meetups" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Meetups  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Blog </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="https://openai.com/news/" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Company blog  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://developers.openai.com/blog" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Developer blog  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div> </div> </div><div id="mobile-nav-panel-4" data-mobile-nav-content data-tab-id="mobile-nav-tab-4" data-href="/codex/use-cases" data-default-variant-id="mobile-nav-tab-4-variant-0" hidden class="flex flex-col gap-4 pb-8 astro-3ef6ksr2">  <div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-4-variant-0" class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/use-cases" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Explore use cases   </a> </li><li> <a href="/codex/use-cases/collections" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Collections   </a> </li> </ul> </div> </div> </div><div id="mobile-nav-panel-5" data-mobile-nav-content data-tab-id="mobile-nav-tab-5" data-href="/codex/resources" data-default-variant-id="mobile-nav-tab-5-variant-0" hidden class="flex flex-col gap-4 pb-8 astro-3ef6ksr2">  <div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-5-variant-0" class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/codex/resources" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Home   </a> </li><li> <a href="/codex/videos" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Videos   </a> </li><li> <a href="https://developers.openai.com/showcase" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Showcase  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://openai.com/academy/" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> OpenAI Academy  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://academy.openai.com/home/events" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Online trainings  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Community </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="https://developers.openai.com/community/codex-ambassadors" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Codex Ambassadors  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://developers.openai.com/community/students" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Codex for Students  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://developers.openai.com/community/codex-for-oss" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Codex for Open Source  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://developers.openai.com/community/meetups" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Meetups  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Blog </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="https://openai.com/news/" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Company blog  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://developers.openai.com/blog" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Developer blog  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div> </div> </div><div id="mobile-nav-panel-7" data-mobile-nav-content data-tab-id="mobile-nav-tab-7" data-href="/learn" data-default-variant-id="mobile-nav-tab-7-variant-0" hidden class="flex flex-col gap-4 pb-8 astro-3ef6ksr2">  <div class="group flex flex-col gap-1 astro-3ef6ksr2" data-mobile-context-options data-context-active="false" data-site-visibility-exclude="chatgpt-docs"> <a href="/showcase" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default astro-3ef6ksr2" data-mobile-nav-link> Showcase </a><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-7-variant-2" data-context-label="Blog" data-context-href="/blog" data-context-is-home="false" data-selected="false"> Blog </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-7-variant-3" data-context-label="Cookbook" data-context-href="/cookbook" data-context-is-home="false" data-selected="false"> Cookbook </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-7-variant-4" data-context-label="Learn" data-context-href="/learn" data-context-is-home="false" data-selected="false"> Learn </button><button type="button" class="w-full rounded-lg px-3 py-2 text-left text-sm font-normal text-secondary transition-colors hover:bg-primary-ghost-hover hover:text-default data-[selected=true]:bg-primary-ghost-active data-[selected=true]:text-default group-data-[context-active=true]:font-semibold astro-3ef6ksr2" data-mobile-context-option data-context-id="mobile-nav-tab-7-variant-5" data-context-label="Community" data-context-href="/community" data-context-is-home="false" data-selected="false"> Community </button> </div> <div id="mobile-nav-tab-7-context-select" data-mobile-context-select data-value="mobile-nav-tab-7-variant-0" data-site-visibility-include="chatgpt-docs" class="astro-3ef6ksr2"> <astro-island uid="2fTSzk" prefix="r70" component-url="/_astro/MobileContextDropdown.react.DrOpjAP1.js" component-export="default" renderer-url="/_astro/client.C85L3Gc5.js" props="{&quot;rootId&quot;:[0,&quot;mobile-nav-tab-7-context-select&quot;],&quot;initialValue&quot;:[0,&quot;mobile-nav-tab-7-variant-0&quot;],&quot;options&quot;:[1,[[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-7-variant-1&quot;],&quot;label&quot;:[0,&quot;Showcase&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-7-variant-2&quot;],&quot;label&quot;:[0,&quot;Blog&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-7-variant-3&quot;],&quot;label&quot;:[0,&quot;Cookbook&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-7-variant-4&quot;],&quot;label&quot;:[0,&quot;Learn&quot;]}],[0,{&quot;value&quot;:[0,&quot;mobile-nav-tab-7-variant-5&quot;],&quot;label&quot;:[0,&quot;Community&quot;]}]]]}" ssr client="load" opts="{&quot;name&quot;:&quot;MobileContextDropdown&quot;,&quot;value&quot;:true}" await-children><div class="flex min-w-0"><div class="relative max-w-full w-full"><select aria-label="Docs section" class="_NativeSelect_10bwq_299" data-native-selectcontrol=""><option value="mobile-nav-tab-7-variant-1">Showcase</option><option value="mobile-nav-tab-7-variant-2">Blog</option><option value="mobile-nav-tab-7-variant-3">Cookbook</option><option value="mobile-nav-tab-7-variant-4">Learn</option><option value="mobile-nav-tab-7-variant-5">Community</option></select><span class="_SelectControl_x887o_1" role="button" tabindex="-1" data-variant="outline" data-block="" data-size="3xl" data-selected="true" aria-disabled="false" id="select-trigger-_r70R_0_" aria-labelledby="_r70R_5H1_ _r70R_5_" aria-hidden="true"><span class="_TriggerText_x887o_510"><span id="_r70R_5H1_" class="sr-only w-full h-0 left-0 bottom-0 pointer-events-none">Docs section</span><span id="_r70R_5_">Select...</span></span><div class="_IndicatorWrapper_x887o_520"><svg width="1em" height="1em" viewBox="0 0 16 9" fill="currentColor" class="_DropdownIcon_x887o_475 _DropdownIconChevron_x887o_586"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L8 6.58579L14.2929 0.292894C14.6834 -0.0976305 15.3166 -0.0976304 15.7071 0.292894C16.0976 0.683418 16.0976 1.31658 15.7071 1.70711L8.70711 8.70711C8.31658 9.09763 7.68342 9.09763 7.29289 8.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z"></path></svg></div></span></div></div><!--astro:end--></astro-island> </div>  <div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-7-variant-0" class="flex flex-col gap-6 astro-3ef6ksr2">  </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-7-variant-1" hidden class="flex flex-col gap-6 astro-3ef6ksr2">  </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-7-variant-2" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/blog" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> All posts   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Recent </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/blog/mastering-codex-remote-for-engineering" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Mastering remote engineering work from your phone   </a> </li><li> <a href="/blog/connect-private-mcp-servers-to-openai-products" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Making private MCP servers reachable without making them public   </a> </li><li> <a href="/blog/realtime-perplexity-computer" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> How Perplexity Brought Voice Search to Millions Using the Realtime API   </a> </li><li> <a href="/blog/designing-delightful-frontends-with-gpt-5-4" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Designing delightful frontends with GPT-5.4   </a> </li><li> <a href="/blog/one-year-of-responses" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> From prompts to products: One year of Responses   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Topics </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/blog/topic/general" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> General   </a> </li><li> <a href="/blog/topic/api" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> API   </a> </li><li> <a href="/blog/topic/apps-sdk" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Apps SDK   </a> </li><li> <a href="/blog/topic/audio" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Audio   </a> </li><li> <a href="/blog/topic/codex" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-7-variant-3" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/cookbook" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Home   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Topics </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/cookbook/topic/agents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Agents   </a> </li><li> <a href="/cookbook/topic/evals" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Evals   </a> </li><li> <a href="/cookbook/topic/multimodal" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Multimodal   </a> </li><li> <a href="/cookbook/topic/text" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Text   </a> </li><li> <a href="/cookbook/topic/guardrails" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Guardrails   </a> </li><li> <a href="/cookbook/topic/optimization" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Optimization   </a> </li><li> <a href="/cookbook/topic/chatgpt" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> ChatGPT   </a> </li><li> <a href="/cookbook/topic/codex" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex   </a> </li><li> <a href="/cookbook/topic/gpt-oss" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> gpt-oss   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Contribute </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="https://github.com/openai/openai-cookbook" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Cookbook on GitHub  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-7-variant-4" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/learn" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Home   </a> </li><li> <a href="/learn/developers-codex-plugin" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> OpenAI Developers plugin   </a> </li><li> <a href="/learn/docs-mcp" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Docs MCP   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Categories </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/learn/code" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Demo apps   </a> </li><li> <a href="/learn/videos" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Videos   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Topics </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/learn/agents" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Agents   </a> </li><li> <a href="/learn/audio" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Audio &amp; Voice   </a> </li><li> <a href="/learn/cua" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Computer Use   </a> </li><li> <a href="/learn/codex" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex   </a> </li><li> <a href="/learn/evals" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Evals   </a> </li><li> <a href="/learn/gpt-oss" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> gpt-oss   </a> </li><li> <a href="/learn/fine-tuning" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Fine-tuning   </a> </li><li> <a href="/learn/imagegen" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Image generation   </a> </li><li> <a href="/learn/scaling" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Scaling   </a> </li><li> <a href="/learn/tools" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Tools   </a> </li><li> <a href="/learn/videogen" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Video generation   </a> </li> </ul> </div> </div><div data-mobile-nav-variant-content data-variant-id="mobile-nav-tab-7-variant-5" hidden class="flex flex-col gap-6 astro-3ef6ksr2"> <div class="flex flex-col gap-3 astro-3ef6ksr2">  <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/community" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Community   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Programs </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/community/codex-ambassadors" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex Ambassadors   </a> </li><li> <a href="/community/students" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex for Students   </a> </li><li> <a href="/community/codex-for-oss" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Codex for Open Source   </a> </li><li> <a href="https://openai.com/business/why-openai/startups/" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> OpenAI for Startups  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Events </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="/community/meetups" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover " data-mobile-nav-link> Meetups   </a> </li> </ul> </div><div class="flex flex-col gap-3 astro-3ef6ksr2"> <h3 class="text-xs tracking-wide text-secondary astro-3ef6ksr2"> Spaces </h3> <ul class="flex flex-col gap-1 text-sm text-default w-full"> <li> <a href="https://community.openai.com/" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Developer Forum  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://discord.com/invite/openai" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Discord  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://www.reddit.com/r/OpenAI/" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> Reddit  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li><li> <a href="https://x.com/OpenAIDevs" class="px-3 py-1.5 rounded-lg transition-colors block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-2" target="_blank" rel="noopener noreferrer" data-mobile-nav-link> X  <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block ml-1 text-gray-600 dark:text-gray-300 " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg> </a> </li> </ul> </div> </div> </div> </div> <div class="w-full px-6 py-6 border-t border-primary-surface astro-3ef6ksr2" data-mobile-nav-footer> <div class="flex flex-col gap-5 astro-3ef6ksr2"> <div data-site-visibility-exclude="chatgpt-docs" class="astro-3ef6ksr2"> <div class="flex items-center gap-2 w-full gap-3 astro-3ef6ksr2"><a target="_blank" rel="noopener noreferrer" href="https://platform.openai.com/login" class="_Button_6dmow_1 not-prose flex-1 justify-center" data-color="primary" data-variant="solid" data-pill="" data-size="md"><span class="_ButtonInner_6dmow_4"><span class="">API Dashboard</span><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" data-external-link-indicator="persistent" class="shrink-0"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></span></a></div> </div><div data-site-visibility-include="chatgpt-docs" class="astro-3ef6ksr2"> <div class="flex items-center gap-2 w-full gap-3 astro-3ef6ksr2"><a target="_blank" rel="noopener noreferrer" href="https://chatgpt.com/" class="_Button_6dmow_1 not-prose flex-1 justify-center" data-color="primary" data-variant="solid" data-pill="" data-size="lg"><span class="_ButtonInner_6dmow_4"><span class="">Try ChatGPT</span><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" data-external-link-indicator="persistent" class="shrink-0"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></span></a></div> </div> <div class="flex flex-wrap items-center gap-4 text-sm text-gray-700 dark:text-gray-300 astro-3ef6ksr2">  </div> </div> </div> </div> </div> <script>
  document.dispatchEvent(new CustomEvent("site-variant:apply"));
</script>  <script>
  const MOBILE_NAV_PERSIST_KEY = "mobile-nav:restore-open";

  const readPersistedMobileNavOpen = () => {
    try {
      return sessionStorage.getItem(MOBILE_NAV_PERSIST_KEY) === "true";
    } catch {
      return false;
    }
  };

  const setPersistedMobileNavOpen = (isOpen) => {
    try {
      if (isOpen) {
        sessionStorage.setItem(MOBILE_NAV_PERSIST_KEY, "true");
      } else {
        sessionStorage.removeItem(MOBILE_NAV_PERSIST_KEY);
      }
    } catch {}
  };

  function initializeMobileNavigation() {
    document.dispatchEvent(new CustomEvent("site-variant:apply"));

    const drawer = document.getElementById("drawer");
    const drawerButton = document.getElementById("header-drawer-button");

    if (
      !drawer ||
      !drawerButton ||
      drawer.dataset.mobileNavInitialized === "true"
    ) {
      return;
    }

    const navTabElements = Array.from(
      drawer.querySelectorAll("[data-mobile-nav-tab]")
    );
    const visibleNavTabElements = navTabElements.filter((tab) => !tab.hidden);
    const defaultSearchPlaceholder =
      drawer.dataset.defaultSearchPlaceholder || "Search the site";
    const defaultSearchScope = drawer.dataset.defaultSearchScope || "";
    const headerSearchOverlay = document.getElementById(
      "header-search-overlay"
    );
    const navLinkElements = Array.from(
      drawer.querySelectorAll("[data-mobile-nav-link]")
    );
    const tabPanels = Array.from(
      drawer.querySelectorAll("[data-mobile-nav-content]")
    );
    const isStarlightApiReferenceRoute =
      window.location.pathname === "/api/reference" ||
      window.location.pathname.startsWith("/api/reference/");
    const shouldRestoreDrawerOpen =
      matchMedia("(max-width: 63.999rem)").matches &&
      !isStarlightApiReferenceRoute &&
      readPersistedMobileNavOpen();

    const configuredDefaultTab = navTabElements.find(
      (tab) => tab.dataset.tabId === drawer.dataset.defaultTabId
    );
    let activeTabId =
      visibleNavTabElements.find((tab) => tab.dataset.isActive === "true")
        ?.dataset.tabId ||
      (!configuredDefaultTab?.hidden
        ? configuredDefaultTab?.dataset.tabId
        : undefined) ||
      visibleNavTabElements[0]?.dataset.tabId ||
      null;

    const updateSelectedOption = (tabId) => {
      let selectedLabel = "";
      let selectedPlaceholder = "";
      let selectedScope = "";

      navTabElements.forEach((tab) => {
        const isSelected = tab.dataset.tabId === tabId;
        tab.dataset.selected = isSelected ? "true" : "false";
        tab.setAttribute("aria-selected", isSelected ? "true" : "false");

        if (isSelected && !selectedLabel) {
          selectedLabel = tab.dataset.label || tab.textContent?.trim() || "";
        }

        if (isSelected && !selectedPlaceholder) {
          selectedPlaceholder = tab.dataset.searchPlaceholder || "";
        }

        if (isSelected && !selectedScope) {
          selectedScope = tab.dataset.searchScope || "";
        }
      });

      if (!selectedLabel && visibleNavTabElements[0]) {
        selectedLabel =
          visibleNavTabElements[0].dataset.label ||
          visibleNavTabElements[0].textContent?.trim() ||
          "";
      }

      if (!selectedPlaceholder && visibleNavTabElements[0]) {
        selectedPlaceholder =
          visibleNavTabElements[0].dataset.searchPlaceholder || "";
      }

      if (!selectedScope && visibleNavTabElements[0]) {
        selectedScope = visibleNavTabElements[0].dataset.searchScope || "";
      }

      const nextPlaceholder = selectedPlaceholder || defaultSearchPlaceholder;
      const nextScope = selectedScope || defaultSearchScope;
      const updatePlaceholder = (container) => {
        if (!container) return;
        const input = container.querySelector("[data-site-search-input]");
        if (input instanceof HTMLInputElement) {
          input.placeholder = nextPlaceholder;
        }
      };
      const updateScope = (container) => {
        if (!container) return;
        const target = container.querySelector("[data-site-search-root]");
        if (!target) return;
        target.setAttribute("data-scope", nextScope);
        target.dispatchEvent(new CustomEvent("site-search:update"));
      };
      updatePlaceholder(drawer);
      updatePlaceholder(headerSearchOverlay);
      updateScope(drawer);
      updateScope(headerSearchOverlay);
    };

    const activeVariantByTabId = new Map();

    const getTabLabel = (tabId) => {
      return (
        navTabElements.find((tab) => tab.dataset.tabId === tabId)?.dataset
          .label || ""
      );
    };

    const updatePanelBreadcrumb = (panel, tabId, contextLabel) => {
      const breadcrumb = panel.querySelector("[data-mobile-breadcrumb]");
      const parent = panel.querySelector("[data-mobile-breadcrumb-parent]");
      const childWrapper = panel.querySelector(
        "[data-mobile-breadcrumb-child-wrapper]"
      );
      const child = panel.querySelector("[data-mobile-breadcrumb-child]");
      const contextOptions = panel.querySelector(
        "[data-mobile-context-options]"
      );

      if (contextOptions) {
        contextOptions.dataset.contextActive = contextLabel ? "true" : "false";
      }

      if (!breadcrumb || !parent || !childWrapper || !child) {
        return;
      }

      const tabLabel = getTabLabel(tabId);
      parent.textContent = tabLabel;

      if (!contextLabel) {
        breadcrumb.setAttribute("hidden", "true");
        childWrapper.setAttribute("hidden", "true");
        child.textContent = "";
        return;
      }

      breadcrumb.removeAttribute("hidden");
      childWrapper.removeAttribute("hidden");
      child.textContent = contextLabel;
    };

    const selectVariantForPanel = (panel, tabId, variantId) => {
      if (!variantId) {
        updatePanelBreadcrumb(panel, tabId, "");
        return;
      }

      const contextOptions = Array.from(
        panel.querySelectorAll("[data-mobile-context-option]")
      );
      const contextSelects = Array.from(
        panel.querySelectorAll("[data-mobile-context-select]")
      );
      let selectedContextLabel = "";

      contextOptions.forEach((option) => {
        const isSelected = option.dataset.contextId === variantId;
        option.dataset.selected = isSelected ? "true" : "false";
        if (isSelected) {
          selectedContextLabel = option.dataset.contextLabel || "";
        }
      });

      contextSelects.forEach((select) => {
        select.dataset.value = variantId;
        select.dispatchEvent(
          new CustomEvent("mobile-context-select-sync", {
            detail: { value: variantId },
          })
        );
      });

      const variantSections = Array.from(
        panel.querySelectorAll("[data-mobile-nav-variant-content]")
      );
      variantSections.forEach((section) => {
        const isSelected = section.dataset.variantId === variantId;
        if (isSelected) {
          section.removeAttribute("hidden");
        } else {
          section.setAttribute("hidden", "true");
        }
      });

      updatePanelBreadcrumb(panel, tabId, selectedContextLabel);
      activeVariantByTabId.set(tabId, variantId);
    };

    const activateTab = (tabId) => {
      if (!tabId) return;
      activeTabId = tabId;
      updateSelectedOption(tabId);

      tabPanels.forEach((panel) => {
        const panelTabId = panel.getAttribute("data-tab-id");
        const isActive = panelTabId === tabId;
        if (isActive) {
          panel.removeAttribute("hidden");
          const defaultVariantId = panel.getAttribute(
            "data-default-variant-id"
          );
          const nextVariantId =
            activeVariantByTabId.get(tabId) ||
            defaultVariantId ||
            panel.querySelector("[data-mobile-nav-variant-content]")?.dataset
              .variantId ||
            "";
          selectVariantForPanel(panel, tabId, nextVariantId);
        } else {
          panel.setAttribute("hidden", "true");
        }
      });
    };

    const closeDrawer = () => {
      drawer.classList.remove("open");
      drawerButton.classList.remove("open");
      drawerButton.setAttribute("aria-expanded", "false");
      setPersistedMobileNavOpen(false);
    };

    const openDrawer = () => {
      drawer.classList.add("open");
      drawerButton.classList.add("open");
      drawerButton.setAttribute("aria-expanded", "true");
      if (activeTabId) {
        activateTab(activeTabId);
      }
    };

    const toggleDrawer = () => {
      if (drawer.classList.contains("open")) {
        closeDrawer();
      } else {
        openDrawer();
      }
    };

    const handleTabSelection = (tab) => {
      const hasNav = tab.dataset.hasNav === "true";
      const href = tab.dataset.href;
      const tabId = tab.dataset.tabId;

      if (!tabId) {
        return;
      }

      if (!hasNav && href) {
        setPersistedMobileNavOpen(true);
        window.location.href = href;
        return;
      }

      activateTab(tabId);
    };

    drawerButton.addEventListener("click", toggleDrawer);

    navTabElements.forEach((tab) => {
      tab.addEventListener("click", () => {
        handleTabSelection(tab);
      });

      tab.addEventListener("keydown", (event) => {
        if (!visibleNavTabElements.length) return;

        const currentIndex = visibleNavTabElements.indexOf(tab);

        if (event.key === "ArrowRight") {
          event.preventDefault();
          const nextIndex = (currentIndex + 1) % visibleNavTabElements.length;
          visibleNavTabElements[nextIndex]?.focus();
        } else if (event.key === "ArrowLeft") {
          event.preventDefault();
          const prevIndex =
            (currentIndex - 1 + visibleNavTabElements.length) %
            visibleNavTabElements.length;
          visibleNavTabElements[prevIndex]?.focus();
        } else if (event.key === "Home") {
          event.preventDefault();
          visibleNavTabElements[0]?.focus();
        } else if (event.key === "End") {
          event.preventDefault();
          visibleNavTabElements[visibleNavTabElements.length - 1]?.focus();
        } else if (
          event.key === "Enter" ||
          event.key === " " ||
          event.key === "Space" ||
          event.key === "Spacebar"
        ) {
          event.preventDefault();
          handleTabSelection(tab);
        } else if (event.key === "Escape") {
          event.preventDefault();
          closeDrawer();
          drawerButton.focus();
        }
      });
    });

    tabPanels.forEach((panel) => {
      const tabId = panel.getAttribute("data-tab-id") || "";
      const contextOptions = Array.from(
        panel.querySelectorAll("[data-mobile-context-option]")
      );

      contextOptions.forEach((option) => {
        option.addEventListener("click", () => {
          const contextHref = option.dataset.contextHref;
          if (
            contextHref &&
            contextHref.startsWith("/api/reference") &&
            tabId
          ) {
            closeDrawer();
            window.location.href = contextHref;
            return;
          }

          const variantId = option.dataset.contextId;
          if (!variantId || !tabId) {
            return;
          }

          selectVariantForPanel(panel, tabId, variantId);
        });
      });

      const contextSelects = Array.from(
        panel.querySelectorAll("[data-mobile-context-select]")
      );
      contextSelects.forEach((select) => {
        select.addEventListener("mobile-context-select-change", (event) => {
          if (!(event instanceof CustomEvent) || !tabId) {
            return;
          }

          const variantId = event.detail?.value;
          if (typeof variantId !== "string") {
            return;
          }

          selectVariantForPanel(panel, tabId, variantId);
        });
      });
    });

    navLinkElements.forEach((link) => {
      link.addEventListener("click", () => {
        closeDrawer();
      });
    });

    const mobileSearch = drawer.querySelector("[data-mobile-search]");
    mobileSearch?.addEventListener("click", (event) => {
      const target = event.target;
      if (target instanceof Element) {
        const anchor = target.closest("a[href]");
        if (anchor) {
          closeDrawer();
        }
      }
    });

    mobileSearch?.addEventListener("focusin", (event) => {
      const target = event.target;
      if (!(target instanceof HTMLInputElement) || target.type !== "text") {
        return;
      }
      closeDrawer();
      window.requestAnimationFrame(() => {
        if (document.activeElement === target) {
          target.blur();
        }
        document.dispatchEvent(
          new CustomEvent("header:open-search", {
            detail: {
              trigger: target,
              variant: "mobile",
            },
          })
        );
      });
    });

    drawer.addEventListener("keydown", (event) => {
      if (event.key === "Escape") {
        closeDrawer();
        drawerButton.focus();
      }
    });

    drawer.dataset.mobileNavInitialized = "true";
    if (activeTabId) {
      activateTab(activeTabId);
    }

    if (shouldRestoreDrawerOpen) {
      openDrawer();
      setPersistedMobileNavOpen(false);
    }
  }

  function initializeHeaderSearch() {
    const overlay = document.getElementById("header-search-overlay");
    if (!overlay) {
      return;
    }

    const getSearchButtons = () =>
      Array.from(document.querySelectorAll("[data-header-search-button]"));

    const closeButtons = overlay.querySelectorAll("[data-header-search-close]");
    const dismissTarget = overlay.querySelector("[data-header-search-dismiss]");
    const panel = overlay.querySelector("[data-header-search-panel]");
    const overlayMobileClass = "header-search-overlay--mobile";
    const panelMobileClass = "header-search-panel--mobile";
    let lastTrigger = null;
    let lastVariant = null;

    const setExpandedState = (isOpen) => {
      const expanded = isOpen ? "true" : "false";
      getSearchButtons().forEach((button) => {
        button.setAttribute("aria-expanded", expanded);
        button.setAttribute("data-active", expanded);
      });
      overlay.dataset.open = expanded;
      overlay.setAttribute("aria-hidden", isOpen ? "false" : "true");
    };

    const focusSearchInput = () => {
      window.requestAnimationFrame(() => {
        const input = overlay.querySelector("[data-site-search-input]");
        if (input) {
          input.focus();
          input.select();
        }
      });
    };

    const openOverlay = (trigger, options = {}) => {
      lastTrigger = trigger ?? document.activeElement;
      const variant = options.variant ?? null;
      lastVariant = typeof variant === "string" ? variant : null;
      overlay.classList.remove("hidden");
      overlay.classList.add("flex");
      const isMobileVariant = lastVariant === "mobile";
      if (isMobileVariant) {
        overlay.dataset.variant = "mobile";
      } else {
        delete overlay.dataset.variant;
      }
      overlay.classList.toggle(overlayMobileClass, isMobileVariant);
      panel?.classList.toggle(panelMobileClass, isMobileVariant);
      document.documentElement.classList.add("has-header-search-open");
      setExpandedState(true);
      focusSearchInput();
    };

    const closeOverlay = () => {
      overlay.classList.add("hidden");
      overlay.classList.remove("flex");
      document.documentElement.classList.remove("has-header-search-open");
      overlay.classList.remove(overlayMobileClass);
      panel?.classList.remove(panelMobileClass);
      delete overlay.dataset.variant;
      setExpandedState(false);
      if (lastTrigger instanceof HTMLElement) {
        if (
          lastVariant === "mobile" &&
          typeof lastTrigger.blur === "function"
        ) {
          lastTrigger.blur();
        } else if (lastVariant !== "mobile") {
          lastTrigger.focus();
        }
      }
      lastTrigger = null;
      lastVariant = null;
    };

    const bindSearchButtons = () => {
      getSearchButtons().forEach((button) => {
        if (button.dataset.searchButtonInitialized === "true") {
          return;
        }

        button.addEventListener("click", (event) => {
          event.preventDefault();
          openOverlay(button);
        });

        button.dataset.searchButtonInitialized = "true";
      });
    };

    if (overlay.dataset.searchInitialized !== "true") {
      closeButtons.forEach((button) => {
        button.addEventListener("click", () => {
          closeOverlay();
        });
      });

      overlay.addEventListener("click", (event) => {
        if (event.target === overlay) {
          closeOverlay();
        }
      });

      dismissTarget?.addEventListener("click", closeOverlay);

      const handleKeydown = (event) => {
        const key = "key" in event ? event.key : undefined;
        const isShortcut =
          !!key &&
          key.toLowerCase() === "k" &&
          (event.metaKey || event.ctrlKey);

        if (isShortcut) {
          event.preventDefault();
          const buttons = getSearchButtons();
          openOverlay(buttons[0] ?? null);
          return;
        }

        if (key === "Escape" && overlay.dataset.open === "true") {
          event.preventDefault();
          closeOverlay();
        }
      };

      document.addEventListener("keydown", handleKeydown);

      document.addEventListener("header:open-search", (event) => {
        const detail =
          event instanceof CustomEvent && typeof event.detail === "object"
            ? event.detail
            : {};
        const trigger =
          detail && detail.trigger instanceof HTMLElement
            ? detail.trigger
            : null;
        openOverlay(trigger, detail);
      });

      document.addEventListener("astro:before-swap", () => {
        if (overlay.dataset.open === "true") {
          closeOverlay();
        }
      });

      overlay.dataset.searchInitialized = "true";
    }

    bindSearchButtons();
  }

  const handleAfterSwap = () => {
    initializeMobileNavigation();
    window.requestAnimationFrame(() => {
      initializeHeaderSearch();
    });
  };

  document.addEventListener("astro:after-swap", handleAfterSwap);
  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", handleAfterSwap, {
      once: true,
    });
  } else {
    handleAfterSwap();
  }
</script> <div data-docs-agent-page class="min-h-dvh"> <div class="flex" style="padding-top: var(--docs-header-offset)"> <div class="hidden lg:flex lg:flex-col w-[218px] px-3 pb-6 pt-2 lg:fixed lg:bottom-0 lg:z-40 bg-surface dark:bg-black astro-73gi4scu" style="top: var(--docs-header-offset)" data-left-nav-container><nav class="flex-1 overflow-y-auto overflow-x-visible astro-73gi4scu" data-left-nav data-left-nav-id="/api/docs"><div class="mt-6 astro-73gi4scu"><ul class="flex flex-col gap-0.25 text-sm text-default w-full"> <li> <a href="/api/docs" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block bg-primary-ghost-hover "> <span class="line-clamp-2 "> Home </span>   </a> </li> </ul></div><div class=" astro-73gi4scu"><h3 class="mb-2 ml-3 mt-6 text-sm font-semibold select-none astro-73gi4scu">Get started</h3><ul class="flex flex-col gap-0.25 text-sm text-default w-full"> <li> <a href="/api/docs/quickstart" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Quickstart </span>   </a> </li><li> <a href="/api/docs/guides/latest-model" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Using GPT-5.6 </span>   </a> </li><li> <a href="/api/docs/concepts" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Key concepts </span>   </a> </li> </ul></div><div class=" astro-73gi4scu"><h3 class="mb-2 ml-3 mt-6 text-sm font-semibold select-none astro-73gi4scu">Core concepts</h3><ul class="flex flex-col gap-0.25 text-sm text-default w-full"> <li> <a href="/api/docs/guides/migrate-to-responses" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Responses API </span>   </a> </li><li> <a href="/api/docs/guides/conversation-state" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Conversation state </span>   </a> </li><li> <a href="/api/docs/guides/background" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Background mode </span>   </a> </li><li> <a href="/api/docs/guides/streaming-responses" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Streaming </span>   </a> </li><li> <a href="/api/docs/guides/websocket-mode" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> WebSocket mode </span>   </a> </li><li> <a href="/api/docs/guides/responses-multi-agent" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Multi-agent </span>   </a> </li><li> <a href="/api/docs/guides/webhooks" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Webhooks </span>   </a> </li><li> <a href="/api/docs/guides/file-inputs" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> File inputs </span>   </a> </li><li> <a href="/api/docs/guides/compaction" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Compaction </span>   </a> </li><li> <a href="/api/docs/guides/token-counting" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Counting tokens </span>   </a> </li> </ul></div><div class=" astro-73gi4scu"><h3 class="mb-2 ml-3 mt-6 text-sm font-semibold select-none astro-73gi4scu">SDKs and CLI</h3><ul class="flex flex-col gap-0.25 text-sm text-default w-full"> <li> <a href="/api/docs/libraries" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> OpenAI SDK </span>   </a> </li><li> <a href="/api/docs/libraries/openai-cli" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> OpenAI CLI </span>   </a> </li> </ul></div><div class=" astro-73gi4scu"><h3 class="mb-2 ml-3 mt-6 text-sm font-semibold select-none astro-73gi4scu">Resources</h3><ul class="flex flex-col gap-0.25 text-sm text-default w-full"> <li> <a href="/api/docs/changelog" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Changelog </span>   </a> </li><li> <a href="/api/docs/deprecations" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Deprecations </span>   </a> </li><li> <a href="/api/docs/supported-countries" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Supported countries </span>   </a> </li><li> <a href="/api/docs/bots" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> OpenAI Crawlers </span>   </a> </li><li> <a href="https://openai.com/policies" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 block hover:text-default hover:bg-primary-ghost-hover flex items-center justify-between gap-1" target="_blank" rel="noopener noreferrer"> <span class="line-clamp-2 min-w-0 flex-1"> Terms and policies </span> <svg data-external-link-indicator="true" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-2 h-2 inline-block shrink-0 text-current " ><path d="M10.2426 0.757385C10.7949 0.757385 11.2426 1.2051 11.2426 1.75738V8.82845C11.2426 9.38074 10.7949 9.82845 10.2426 9.82845C9.69035 9.82845 9.24264 9.38074 9.24264 8.82845V4.1716L2.46446 10.9498C2.07394 11.3403 1.44077 11.3403 1.05025 10.9498C0.659724 10.5592 0.659723 9.92608 1.05025 9.53556L7.82842 2.75739H3.17157C2.61928 2.75739 2.17157 2.30967 2.17157 1.75738C2.17157 1.2051 2.61928 0.757385 3.17157 0.757385H10.2426Z" fill="currentColor"></path></svg>  </a> </li> </ul></div><div class=" astro-73gi4scu"><h3 class="mb-2 ml-3 mt-6 text-sm font-semibold select-none astro-73gi4scu">Legacy APIs</h3><ul class="flex flex-col gap-0.25 text-sm text-default w-full"> <li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 flex items-center justify-between hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1 min-w-0 line-clamp-2">Agent Builder</span>  <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block ml-1 text-current transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-0.5 text-sm text-default w-full mb-2 "> <li> <a href="/api/docs/guides/agent-builder" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Overview </span>   </a> </li><li> <a href="/api/docs/guides/agent-builder/migrate-from-agent-builder" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Migration guide </span>   </a> </li><li> <a href="/api/docs/guides/node-reference" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Node reference </span>   </a> </li><li> <a href="/api/docs/guides/agent-builder-safety" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Safety in building agents </span>   </a> </li> </ul> </details> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 flex items-center justify-between hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1 min-w-0 line-clamp-2">Evals</span>  <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block ml-1 text-current transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-0.5 text-sm text-default w-full mb-2 "> <li> <a href="/api/docs/guides/evaluation-getting-started" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Getting started </span>   </a> </li><li> <a href="/api/docs/guides/evals" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Working with evals </span>   </a> </li><li> <a href="/api/docs/guides/prompt-optimizer" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Prompt optimizer </span>   </a> </li><li> <a href="/api/docs/guides/external-models" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> External models </span>   </a> </li><li> <a href="/api/docs/guides/evaluation-best-practices" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Best practices </span>   </a> </li><li> <a href="/api/docs/guides/graders" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Graders </span>   </a> </li> </ul> </details> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 flex items-center justify-between hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1 min-w-0 line-clamp-2">Fine-tuning</span>  <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block ml-1 text-current transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-0.5 text-sm text-default w-full mb-2 "> <li> <a href="/api/docs/guides/model-optimization" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Optimization cycle </span>   </a> </li><li> <a href="/api/docs/guides/supervised-fine-tuning" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Supervised fine-tuning </span>   </a> </li><li> <a href="/api/docs/guides/vision-fine-tuning" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Vision fine-tuning </span>   </a> </li><li> <a href="/api/docs/guides/direct-preference-optimization" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Direct preference optimization </span>   </a> </li><li> <a href="/api/docs/guides/reinforcement-fine-tuning" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Reinforcement fine-tuning </span>   </a> </li><li> <a href="/api/docs/guides/rft-use-cases" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> RFT use cases </span>   </a> </li><li> <a href="/api/docs/guides/fine-tuning-best-practices" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Best practices </span>   </a> </li> </ul> </details> </li><li> <details class="nav-disclosure"> <summary class="list-none cursor-pointer select-none px-3 py-1.5 w-full rounded-[8px] transition-colors text-default pl-5 flex items-center justify-between hover:text-default hover:bg-primary-ghost-hover"> <span class="flex-1 min-w-0 line-clamp-2">Assistants API</span>  <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="nav-disclosure-chevron w-3 h-3 inline-block ml-1 text-current transition-transform duration-150 " aria-hidden="true" ><path d="M8.29289 4.29289C8.68342 3.90237 9.31658 3.90237 9.70711 4.29289L16.7071 11.2929C17.0976 11.6834 17.0976 12.3166 16.7071 12.7071L9.70711 19.7071C9.31658 20.0976 8.68342 20.0976 8.29289 19.7071C7.90237 19.3166 7.90237 18.6834 8.29289 18.2929L14.5858 12L8.29289 5.70711C7.90237 5.31658 7.90237 4.68342 8.29289 4.29289Z" fill="currentColor"></path></svg> </summary> <ul class="mt-1 ml-3 max-w-[calc(100%-theme(spacing.3))] flex flex-col gap-0.5 text-sm text-default w-full mb-2 "> <li> <a href="/api/docs/assistants/migration" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Migration guide </span>   </a> </li><li> <a href="/api/docs/assistants/deep-dive" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Deep dive </span>   </a> </li><li> <a href="/api/docs/assistants/tools" class="px-3 py-1.5 w-full rounded-[8px] transition-colors text-default block hover:text-default hover:bg-primary-ghost-hover "> <span class="line-clamp-2 "> Tools </span>   </a> </li> </ul> </details> </li> </ul></div></nav></div><script>
  const NAV_SELECTOR = "nav[data-left-nav]";
  const STORAGE_PREFIX = "left-nav-scroll:";
  const INITIALIZED_ATTRIBUTE = "data-left-nav-scroll-initialized";

  const isStorageAvailable = (() => {
    try {
      const storageKey = `${STORAGE_PREFIX}__test__`;
      sessionStorage.setItem(storageKey, "1");
      sessionStorage.removeItem(storageKey);
      return true;
    } catch (error) {
      return false;
    }
  })();

  const getNav = () => document.querySelector(NAV_SELECTOR);

  const getStorageKey = (nav) =>
    `${STORAGE_PREFIX}${nav.dataset.leftNavId ?? "default"}`;

  const restoreScrollPosition = (nav) => {
    if (!isStorageAvailable) return;
    const storedValue = sessionStorage.getItem(getStorageKey(nav));
    if (storedValue !== null) {
      nav.scrollTop = Number(storedValue);
    }
  };

  const saveScrollPosition = (nav) => {
    if (!isStorageAvailable) return;
    sessionStorage.setItem(getStorageKey(nav), String(nav.scrollTop));
  };

  const setupNav = () => {
    const nav = getNav();
    if (!nav || nav.getAttribute(INITIALIZED_ATTRIBUTE) === "true") return;

    restoreScrollPosition(nav);

    nav.addEventListener(
      "scroll",
      () => {
        saveScrollPosition(nav);
      },
      { passive: true }
    );

    nav.setAttribute(INITIALIZED_ATTRIBUTE, "true");
  };

  const persistScrollPosition = () => {
    const nav = getNav();
    if (!nav) return;
    saveScrollPosition(nav);
  };

  const initialize = () => {
    setupNav();
    const nav = getNav();
    if (!nav) return;
    restoreScrollPosition(nav);
  };

  window.addEventListener("pageshow", initialize);
  document.addEventListener("astro:page-load", initialize);
  document.addEventListener("astro:after-swap", initialize);

  document.addEventListener("astro:before-swap", persistScrollPosition);
  window.addEventListener("beforeunload", persistScrollPosition);

  initialize();
</script> <main class="min-w-0 flex-1 lg:pl-[240px]">  <astro-island uid="TDdcN" prefix="r8" component-url="/_astro/PlatformOverview.react.S5BvXTJj.js" component-export="default" renderer-url="/_astro/client.C85L3Gc5.js" props="{}" ssr client="load" opts="{&quot;name&quot;:&quot;PlatformOverview&quot;,&quot;value&quot;:true}" await-children><section class="mx-auto w-full max-w-6xl px-4 py-8 md:px-12 xl:px-4"><div class="flex flex-col gap-6 md:gap-7"><div><h1 class="m-0 heading-2xl md:heading-2xl text-[var(--color-text-emphasis)]">API Platform</h1></div><div class="rounded-2xl bg-surface-secondary px-6 py-4 md:px-8 md:py-5"><div class="flex flex-col gap-6 lg:flex-row lg:items-center"><div class="flex max-w-sm flex-col gap-3"><h2 class="text-lg font-semibold text-[var(--color-text-emphasis)]">Developer quickstart</h2><p class="text-sm text-[var(--color-text-secondary)]">Make your first API request in minutes. Learn the basics of the OpenAI platform.</p><div class="flex flex-wrap gap-2 pt-1"><a href="/api/docs/quickstart" class="_Button_6dmow_1" data-color="primary" data-variant="solid" data-pill="" data-size="lg"><span class="_ButtonInner_6dmow_4">Get started</span></a><a target="_blank" rel="noopener noreferrer" href="https://platform.openai.com/api-keys" class="_Button_6dmow_1" data-color="secondary" data-variant="soft" data-pill="" data-size="lg"><span class="_ButtonInner_6dmow_4">Create API key</span></a></div></div><div class="quickstart-code-sample w-full flex-1 rounded-xl bg-surface-secondary [&amp;_.code-sample]:my-0"><div class="code-sample not-prose _root_1x2h7_2 _flush_1x2h7_16 light-mode"><div class="_header_1x2h7_34"><div class="_title_1x2h7_42 body-small"></div><div class="exclude-from-copy"><span class="_SelectControl_x887o_1" role="button" tabindex="0" data-variant="ghost" data-size="sm" data-selected="true" aria-disabled="false" id="select-trigger-_r8R_9i_" type="button" aria-haspopup="dialog" aria-expanded="false" aria-controls="radix-_r8R_1pi_" data-state="closed"><span class="_TriggerText_x887o_510"><span id="_r8R_7pi_">javascript</span></span><div class="_IndicatorWrapper_x887o_520"><svg width="1em" height="1em" viewBox="0 0 10 16" fill="currentColor" class="_DropdownIcon_x887o_475"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.34151 0.747423C4.71854 0.417526 5.28149 0.417526 5.65852 0.747423L9.65852 4.24742C10.0742 4.61111 10.1163 5.24287 9.75259 5.6585C9.38891 6.07414 8.75715 6.11626 8.34151 5.75258L5.00001 2.82877L1.65852 5.75258C1.24288 6.11626 0.61112 6.07414 0.247438 5.6585C-0.116244 5.24287 -0.0741267 4.61111 0.34151 4.24742L4.34151 0.747423ZM0.246065 10.3578C0.608879 9.94139 1.24055 9.89795 1.65695 10.2608L5.00001 13.1737L8.34308 10.2608C8.75948 9.89795 9.39115 9.94139 9.75396 10.3578C10.1168 10.7742 10.0733 11.4058 9.65695 11.7687L5.65695 15.2539C5.28043 15.582 4.7196 15.582 4.34308 15.2539L0.343082 11.7687C-0.0733128 11.4058 -0.116749 10.7742 0.246065 10.3578Z"></path></svg></div></span></div><button type="button" class="_Button_6dmow_1 _copyButton_1x2h7_168" data-color="primary" data-variant="ghost" data-size="sm" data-gutter-size="xs" data-icon-size="sm" aria-label="Copy code"><span class="_ButtonInner_6dmow_4"><span class="block relative w-[var(--button-icon-size)] h-[var(--button-icon-size)]" data-transition-position="absolute" style="--tg-will-change:transform, opacity;--tg-enter-opacity:1;--tg-enter-transform:scale(1);--tg-enter-filter:none;--tg-enter-duration:300ms;--tg-enter-delay:150ms;--tg-enter-timing-function:var(--cubic-enter);--tg-exit-opacity:0;--tg-exit-transform:scale(0.6);--tg-exit-filter:none;--tg-exit-duration:150ms;--tg-exit-delay:0ms;--tg-exit-timing-function:var(--cubic-exit);--tg-initial-opacity:0;--tg-initial-transform:scale(0.6);--tg-initial-filter:none"><span class="_TransitionItem_1lpir_1 _TransitionGroupChild_1d6a5_1"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path d="M12.7587 2H16.2413C17.0463 1.99999 17.7106 1.99998 18.2518 2.04419C18.8139 2.09012 19.3306 2.18868 19.816 2.43597C20.5686 2.81947 21.1805 3.43139 21.564 4.18404C21.8113 4.66937 21.9099 5.18608 21.9558 5.74817C22 6.28936 22 6.95372 22 7.75868V11.2413C22 12.0463 22 12.7106 21.9558 13.2518C21.9099 13.8139 21.8113 14.3306 21.564 14.816C21.1805 15.5686 20.5686 16.1805 19.816 16.564C19.3306 16.8113 18.8139 16.9099 18.2518 16.9558C17.8906 16.9853 17.4745 16.9951 16.9984 16.9984C16.9951 17.4745 16.9853 17.8906 16.9558 18.2518C16.9099 18.8139 16.8113 19.3306 16.564 19.816C16.1805 20.5686 15.5686 21.1805 14.816 21.564C14.3306 21.8113 13.8139 21.9099 13.2518 21.9558C12.7106 22 12.0463 22 11.2413 22H7.75868C6.95372 22 6.28936 22 5.74818 21.9558C5.18608 21.9099 4.66937 21.8113 4.18404 21.564C3.43139 21.1805 2.81947 20.5686 2.43597 19.816C2.18868 19.3306 2.09012 18.8139 2.04419 18.2518C1.99998 17.7106 1.99999 17.0463 2 16.2413V12.7587C1.99999 11.9537 1.99998 11.2894 2.04419 10.7482C2.09012 10.1861 2.18868 9.66937 2.43597 9.18404C2.81947 8.43139 3.43139 7.81947 4.18404 7.43598C4.66937 7.18868 5.18608 7.09012 5.74817 7.04419C6.10939 7.01468 6.52548 7.00487 7.00162 7.00162C7.00487 6.52548 7.01468 6.10939 7.04419 5.74817C7.09012 5.18608 7.18868 4.66937 7.43598 4.18404C7.81947 3.43139 8.43139 2.81947 9.18404 2.43597C9.66937 2.18868 10.1861 2.09012 10.7482 2.04419C11.2894 1.99998 11.9537 1.99999 12.7587 2ZM9.00176 7L11.2413 7C12.0463 6.99999 12.7106 6.99998 13.2518 7.04419C13.8139 7.09012 14.3306 7.18868 14.816 7.43598C15.5686 7.81947 16.1805 8.43139 16.564 9.18404C16.8113 9.66937 16.9099 10.1861 16.9558 10.7482C17 11.2894 17 11.9537 17 12.7587V14.9982C17.4455 14.9951 17.7954 14.9864 18.089 14.9624C18.5274 14.9266 18.7516 14.8617 18.908 14.782C19.2843 14.5903 19.5903 14.2843 19.782 13.908C19.8617 13.7516 19.9266 13.5274 19.9624 13.089C19.9992 12.6389 20 12.0566 20 11.2V7.8C20 6.94342 19.9992 6.36113 19.9624 5.91104C19.9266 5.47262 19.8617 5.24842 19.782 5.09202C19.5903 4.7157 19.2843 4.40973 18.908 4.21799C18.7516 4.1383 18.5274 4.07337 18.089 4.03755C17.6389 4.00078 17.0566 4 16.2 4H12.8C11.9434 4 11.3611 4.00078 10.911 4.03755C10.4726 4.07337 10.2484 4.1383 10.092 4.21799C9.7157 4.40973 9.40973 4.7157 9.21799 5.09202C9.1383 5.24842 9.07337 5.47262 9.03755 5.91104C9.01357 6.20463 9.00489 6.55447 9.00176 7ZM5.91104 9.03755C5.47262 9.07337 5.24842 9.1383 5.09202 9.21799C4.7157 9.40973 4.40973 9.7157 4.21799 10.092C4.1383 10.2484 4.07337 10.4726 4.03755 10.911C4.00078 11.3611 4 11.9434 4 12.8V16.2C4 17.0566 4.00078 17.6389 4.03755 18.089C4.07337 18.5274 4.1383 18.7516 4.21799 18.908C4.40973 19.2843 4.7157 19.5903 5.09202 19.782C5.24842 19.8617 5.47262 19.9266 5.91104 19.9624C6.36113 19.9992 6.94342 20 7.8 20H11.2C12.0566 20 12.6389 19.9992 13.089 19.9624C13.5274 19.9266 13.7516 19.8617 13.908 19.782C14.2843 19.5903 14.5903 19.2843 14.782 18.908C14.8617 18.7516 14.9266 18.5274 14.9624 18.089C14.9992 17.6389 15 17.0566 15 16.2V12.8C15 11.9434 14.9992 11.3611 14.9624 10.911C14.9266 10.4726 14.8617 10.2484 14.782 10.092C14.5903 9.7157 14.2843 9.40973 13.908 9.21799C13.7516 9.1383 13.5274 9.07337 13.089 9.03755C12.6389 9.00078 12.0566 9 11.2 9H7.8C6.94342 9 6.36113 9.00078 5.91104 9.03755Z" fill="currentColor"></path></svg></span></span></span></button><span aria-live="polite" class="sr-only"></span></div><div class="_body_1x2h7_59 _bodySmall_1x2h7_151 _bodyWithHeader_1x2h7_139"><div class="code-block hidden"><pre class="hljs syntax-highlighter light-mode _pre_1x2h7_62" data-1p-ignore="true" data-copy-ignore="true"><code data-1p-ignore="true" data-language="bash" style="white-space:pre"><code style="float:left;padding-right:10px"><span class="react-syntax-highlighter-line-number">1
</span><span class="react-syntax-highlighter-line-number">2
</span><span class="react-syntax-highlighter-line-number">3
</span><span class="react-syntax-highlighter-line-number">4
</span><span class="react-syntax-highlighter-line-number">5
</span><span class="react-syntax-highlighter-line-number">6
</span><span class="react-syntax-highlighter-line-number">7
</span></code><span><span>curl https://api.openai.com/v1/responses \
</span></span><span><span>  -H </span><span class="hljs-string">&quot;Content-Type: application/json&quot;</span><span> \
</span></span><span><span>  -H </span><span class="hljs-string">&quot;Authorization: Bearer </span><span class="hljs-string hljs-variable">$OPENAI_API_KEY</span><span class="hljs-string">&quot;</span><span> \
</span></span><span><span>  -d </span><span class="hljs-string">&#x27;{
</span></span><span class="hljs-string">    &quot;model&quot;: &quot;gpt-5.6&quot;,
</span><span class="hljs-string">    &quot;input&quot;: &quot;Write a short bedtime story about a unicorn.&quot;
</span><span class="hljs-string">  }&#x27;</span></code></pre></div><div class="code-block"><pre class="hljs syntax-highlighter light-mode _pre_1x2h7_62" data-1p-ignore="true" data-copy-ignore="true"><code data-1p-ignore="true" data-language="javascript" style="white-space:pre"><code style="float:left;padding-right:10px"><span class="react-syntax-highlighter-line-number">1
</span><span class="react-syntax-highlighter-line-number">2
</span><span class="react-syntax-highlighter-line-number">3
</span><span class="react-syntax-highlighter-line-number">4
</span><span class="react-syntax-highlighter-line-number">5
</span><span class="react-syntax-highlighter-line-number">6
</span><span class="react-syntax-highlighter-line-number">7
</span><span class="react-syntax-highlighter-line-number">8
</span><span class="react-syntax-highlighter-line-number">9
</span></code><span><span class="hljs-keyword">import</span><span> OpenAI </span><span class="hljs-keyword">from</span><span> </span><span class="hljs-string">&quot;openai&quot;</span><span>;
</span></span><span><span></span><span class="hljs-keyword">const</span><span> client = </span><span class="hljs-keyword">new</span><span> OpenAI();
</span></span><span>
</span><span><span></span><span class="hljs-keyword">const</span><span> response = </span><span class="hljs-keyword">await</span><span> client.responses.create({
</span></span><span><span>  </span><span class="hljs-attr">model</span><span>: </span><span class="hljs-string">&quot;gpt-5.6&quot;</span><span>,
</span></span><span><span>  </span><span class="hljs-attr">input</span><span>: </span><span class="hljs-string">&quot;Write a short bedtime story about a unicorn.&quot;</span><span>,
</span></span><span>});
</span><span>
</span><span><span></span><span class="hljs-built_in">console</span><span>.log(response.output_text);</span></span></code></pre></div><div class="code-block hidden"><pre class="hljs syntax-highlighter light-mode _pre_1x2h7_62" data-1p-ignore="true" data-copy-ignore="true"><code data-1p-ignore="true" data-language="python" style="white-space:pre"><code style="float:left;padding-right:10px"><span class="react-syntax-highlighter-line-number">1
</span><span class="react-syntax-highlighter-line-number">2
</span><span class="react-syntax-highlighter-line-number">3
</span><span class="react-syntax-highlighter-line-number">4
</span><span class="react-syntax-highlighter-line-number">5
</span><span class="react-syntax-highlighter-line-number">6
</span><span class="react-syntax-highlighter-line-number">7
</span><span class="react-syntax-highlighter-line-number">8
</span><span class="react-syntax-highlighter-line-number">9
</span></code><span><span class="hljs-keyword">from</span><span> openai </span><span class="hljs-keyword">import</span><span> OpenAI
</span></span><span>client = OpenAI()
</span><span>
</span><span>response = client.responses.create(
</span><span><span>    model=</span><span class="hljs-string">&quot;gpt-5.6&quot;</span><span>,
</span></span><span><span>    </span><span class="hljs-built_in">input</span><span>=</span><span class="hljs-string">&quot;Write a short bedtime story about a unicorn.&quot;</span><span>
</span></span><span>)
</span><span>
</span><span><span></span><span class="hljs-built_in">print</span><span>(response.output_text)</span></span></code></pre></div><div class="code-block hidden"><pre class="hljs syntax-highlighter light-mode _pre_1x2h7_62" data-1p-ignore="true" data-copy-ignore="true"><code data-1p-ignore="true" data-language="csharp" style="white-space:pre"><code style="float:left;padding-right:10px"><span class="react-syntax-highlighter-line-number">1
</span><span class="react-syntax-highlighter-line-number">2
</span><span class="react-syntax-highlighter-line-number">3
</span><span class="react-syntax-highlighter-line-number">4
</span><span class="react-syntax-highlighter-line-number">5
</span><span class="react-syntax-highlighter-line-number">6
</span><span class="react-syntax-highlighter-line-number">7
</span><span class="react-syntax-highlighter-line-number">8
</span><span class="react-syntax-highlighter-line-number">9
</span><span class="react-syntax-highlighter-line-number">10
</span></code><span><span class="hljs-keyword">using</span><span> OpenAI.Responses;
</span></span><span>
</span><span><span></span><span class="hljs-built_in">string</span><span> apiKey = Environment.GetEnvironmentVariable(</span><span class="hljs-string">&quot;OPENAI_API_KEY&quot;</span><span>)!;
</span></span><span><span></span><span class="hljs-keyword">var</span><span> client = </span><span class="hljs-keyword">new</span><span> OpenAIResponseClient(model: </span><span class="hljs-string">&quot;gpt-5.6&quot;</span><span>, apiKey: apiKey);
</span></span><span>
</span><span>OpenAIResponse response = client.CreateResponse(
</span><span><span>    </span><span class="hljs-string">&quot;Write a short bedtime story about a unicorn.&quot;</span><span>
</span></span><span>);
</span><span>
</span><span>Console.WriteLine(response.GetOutputText());</span></code></pre></div><div class="code-block hidden"><pre class="hljs syntax-highlighter light-mode _pre_1x2h7_62" data-1p-ignore="true" data-copy-ignore="true"><code data-1p-ignore="true" data-language="java" style="white-space:pre"><code style="float:left;padding-right:10px"><span class="react-syntax-highlighter-line-number">1
</span><span class="react-syntax-highlighter-line-number">2
</span><span class="react-syntax-highlighter-line-number">3
</span><span class="react-syntax-highlighter-line-number">4
</span><span class="react-syntax-highlighter-line-number">5
</span><span class="react-syntax-highlighter-line-number">6
</span><span class="react-syntax-highlighter-line-number">7
</span><span class="react-syntax-highlighter-line-number">8
</span><span class="react-syntax-highlighter-line-number">9
</span><span class="react-syntax-highlighter-line-number">10
</span><span class="react-syntax-highlighter-line-number">11
</span><span class="react-syntax-highlighter-line-number">12
</span><span class="react-syntax-highlighter-line-number">13
</span><span class="react-syntax-highlighter-line-number">14
</span><span class="react-syntax-highlighter-line-number">15
</span><span class="react-syntax-highlighter-line-number">16
</span><span class="react-syntax-highlighter-line-number">17
</span><span class="react-syntax-highlighter-line-number">18
</span><span class="react-syntax-highlighter-line-number">19
</span><span class="react-syntax-highlighter-line-number">20
</span></code><span><span class="hljs-keyword">import</span><span> com.openai.client.OpenAIClient;
</span></span><span><span></span><span class="hljs-keyword">import</span><span> com.openai.client.okhttp.OpenAIOkHttpClient;
</span></span><span><span></span><span class="hljs-keyword">import</span><span> com.openai.models.responses.Response;
</span></span><span><span></span><span class="hljs-keyword">import</span><span> com.openai.models.responses.ResponseCreateParams;
</span></span><span>
</span><span><span></span><span class="hljs-keyword">public</span><span> </span><span class="hljs-class hljs-keyword">class</span><span class="hljs-class"> </span><span class="hljs-class hljs-title">PlatformOverviewExample</span><span class="hljs-class"> </span><span>{
</span></span><span><span>  </span><span class="hljs-function hljs-keyword">public</span><span class="hljs-function"> </span><span class="hljs-function hljs-keyword">static</span><span class="hljs-function"> </span><span class="hljs-function hljs-keyword">void</span><span class="hljs-function"> </span><span class="hljs-function hljs-title">main</span><span class="hljs-function hljs-params">(String[] args)</span><span class="hljs-function"> </span><span>{
</span></span><span>    OpenAIClient client = OpenAIOkHttpClient.fromEnv();
</span><span>
</span><span>    ResponseCreateParams params =
</span><span><span>        ResponseCreateParams.builder().model(</span><span class="hljs-string">&quot;gpt-5.6&quot;</span><span>).input(</span><span class="hljs-string">&quot;Write a short bedtime story about a unicorn.&quot;</span><span>).build();
</span></span><span>
</span><span>    Response response = client.responses().create(params);
</span><span>    response.output().stream()
</span><span>        .flatMap(item -&gt; item.message().stream())
</span><span>        .flatMap(message -&gt; message.content().stream())
</span><span>        .flatMap(content -&gt; content.outputText().stream())
</span><span>        .forEach(outputText -&gt; System.out.println(outputText.text()));
</span><span>  }
</span><span>}</span></code></pre></div><div class="code-block hidden"><pre class="hljs syntax-highlighter light-mode _pre_1x2h7_62" data-1p-ignore="true" data-copy-ignore="true"><code data-1p-ignore="true" data-language="go" style="white-space:pre"><code style="float:left;padding-right:10px"><span class="react-syntax-highlighter-line-number">1
</span><span class="react-syntax-highlighter-line-number">2
</span><span class="react-syntax-highlighter-line-number">3
</span><span class="react-syntax-highlighter-line-number">4
</span><span class="react-syntax-highlighter-line-number">5
</span><span class="react-syntax-highlighter-line-number">6
</span><span class="react-syntax-highlighter-line-number">7
</span><span class="react-syntax-highlighter-line-number">8
</span><span class="react-syntax-highlighter-line-number">9
</span><span class="react-syntax-highlighter-line-number">10
</span><span class="react-syntax-highlighter-line-number">11
</span><span class="react-syntax-highlighter-line-number">12
</span><span class="react-syntax-highlighter-line-number">13
</span><span class="react-syntax-highlighter-line-number">14
</span><span class="react-syntax-highlighter-line-number">15
</span><span class="react-syntax-highlighter-line-number">16
</span><span class="react-syntax-highlighter-line-number">17
</span><span class="react-syntax-highlighter-line-number">18
</span><span class="react-syntax-highlighter-line-number">19
</span><span class="react-syntax-highlighter-line-number">20
</span><span class="react-syntax-highlighter-line-number">21
</span><span class="react-syntax-highlighter-line-number">22
</span><span class="react-syntax-highlighter-line-number">23
</span><span class="react-syntax-highlighter-line-number">24
</span><span class="react-syntax-highlighter-line-number">25
</span></code><span><span class="hljs-keyword">package</span><span> main
</span></span><span>
</span><span><span></span><span class="hljs-keyword">import</span><span> (
</span></span><span><span>	</span><span class="hljs-string">&quot;context&quot;</span><span>
</span></span><span><span>	</span><span class="hljs-string">&quot;fmt&quot;</span><span>
</span></span><span>
</span><span><span>	</span><span class="hljs-string">&quot;github.com/openai/openai-go/v3&quot;</span><span>
</span></span><span><span>	</span><span class="hljs-string">&quot;github.com/openai/openai-go/v3/responses&quot;</span><span>
</span></span><span>)
</span><span>
</span><span><span></span><span class="hljs-function hljs-keyword">func</span><span class="hljs-function"> </span><span class="hljs-function hljs-title">main</span><span class="hljs-function hljs-params">()</span><span> {
</span></span><span>	client := openai.NewClient()
</span><span>
</span><span>	response, err := client.Responses.New(context.Background(), responses.ResponseNewParams{
</span><span><span>		Model: </span><span class="hljs-string">&quot;gpt-5.6&quot;</span><span>,
</span></span><span>		Input: responses.ResponseNewParamsInputUnion{
</span><span><span>			OfString: openai.String(</span><span class="hljs-string">&quot;Write a short bedtime story about a unicorn.&quot;</span><span>),
</span></span><span>		},
</span><span>	})
</span><span><span>	</span><span class="hljs-keyword">if</span><span> err != </span><span class="hljs-literal">nil</span><span> {
</span></span><span><span>		</span><span class="hljs-built_in">panic</span><span>(err)
</span></span><span>	}
</span><span>
</span><span>	fmt.Println(response.OutputText())
</span><span>}</span></code></pre></div><div class="code-block hidden"><pre class="hljs syntax-highlighter light-mode _pre_1x2h7_62" data-1p-ignore="true" data-copy-ignore="true"><code data-1p-ignore="true" data-language="ruby" style="white-space:pre"><code style="float:left;padding-right:10px"><span class="react-syntax-highlighter-line-number">1
</span><span class="react-syntax-highlighter-line-number">2
</span><span class="react-syntax-highlighter-line-number">3
</span><span class="react-syntax-highlighter-line-number">4
</span><span class="react-syntax-highlighter-line-number">5
</span><span class="react-syntax-highlighter-line-number">6
</span><span class="react-syntax-highlighter-line-number">7
</span><span class="react-syntax-highlighter-line-number">8
</span><span class="react-syntax-highlighter-line-number">9
</span><span class="react-syntax-highlighter-line-number">10
</span></code><span><span class="hljs-keyword">require</span><span> </span><span class="hljs-string">&quot;openai&quot;</span><span>
</span></span><span>
</span><span>openai = OpenAI::Client.new
</span><span>
</span><span>response = openai.responses.create(
</span><span><span>  </span><span class="hljs-symbol">model:</span><span> </span><span class="hljs-string">&quot;gpt-5.6&quot;</span><span>,
</span></span><span><span>  </span><span class="hljs-symbol">input:</span><span> </span><span class="hljs-string">&quot;Write a short bedtime story about a unicorn.&quot;</span><span>
</span></span><span>)
</span><span>
</span><span>puts(response.output_text)</span></code></pre></div><div class="code-block hidden"><pre class="hljs syntax-highlighter light-mode _pre_1x2h7_62" data-1p-ignore="true" data-copy-ignore="true"><code data-1p-ignore="true" data-language="bash" style="white-space:pre"><code style="float:left;padding-right:10px"><span class="react-syntax-highlighter-line-number">1
</span><span class="react-syntax-highlighter-line-number">2
</span><span class="react-syntax-highlighter-line-number">3
</span><span class="react-syntax-highlighter-line-number">4
</span><span class="react-syntax-highlighter-line-number">5
</span></code><span><span>openai responses create \
</span></span><span>  --model gpt-5.6 \
</span><span><span>  --input </span><span class="hljs-string">&quot;Write a short bedtime story about a unicorn.&quot;</span><span> \
</span></span><span>  --raw-output \
</span><span><span>  --transform </span><span class="hljs-string">&#x27;output.#(type==&quot;message&quot;).content.0.text&#x27;</span></span></code></pre></div></div></div></div></div></div><aside class="not-prose rounded-xl border border-default bg-surface px-5 py-4"><div class="flex flex-col gap-4 md:flex-row md:items-center md:justify-between"><div><p class="text-sm font-semibold text-emphasis">Build with the OpenAI API in Codex</p><p class="mt-1 text-sm leading-6 text-secondary">The OpenAI Developers plugin enables Codex to connect to the OpenAI Platform, follow OpenAI API setup guidance, and create project API keys when your app needs one.</p></div><a href="/learn/developers-codex-plugin" class="_Button_6dmow_1 not-prose shrink-0" data-color="secondary" data-variant="soft" data-pill="" data-size="lg" target="_blank" rel="noreferrer"><span class="_ButtonInner_6dmow_4">Install the plugin</span></a></div></aside><section class="flex flex-col gap-3"><h2 class="text-3xl font-semibold tracking-tight text-emphasis">Build paths</h2><div class="grid gap-4 md:grid-cols-2"><a href="/api/docs/guides/text" class="group flex h-full flex-col justify-between rounded-lg border border-default bg-surface p-4 text-emphasis no-underline transition hover:bg-surface-secondary hover:no-underline"><div><h3 class="text-base font-semibold">Responses API</h3><p class="mt-2 text-sm leading-5 text-secondary">Make direct model requests for text, structured output, tools, and multimodal workflows.</p></div><span class="mt-4 inline-flex items-center gap-1 text-sm font-medium text-emphasis">Start with Responses<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" class="transition group-hover:-translate-y-0.5 group-hover:translate-x-0.5"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></span></a><a href="/api/docs/guides/agents/quickstart" class="group flex h-full flex-col justify-between rounded-lg border border-default bg-surface p-4 text-emphasis no-underline transition hover:bg-surface-secondary hover:no-underline"><div><h3 class="text-base font-semibold">Agents SDK</h3><p class="mt-2 text-sm leading-5 text-secondary">Build code-first agents that orchestrate tools, handoffs, approvals, tracing, and container-based execution.</p></div><span class="mt-4 inline-flex items-center gap-1 text-sm font-medium text-emphasis">Start with the Agents SDK<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" class="transition group-hover:-translate-y-0.5 group-hover:translate-x-0.5"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></span></a></div></section><div class="mb-7 flex w-full flex-col gap-7"><div class="flex flex-col gap-1 md:flex-row md:items-center md:justify-between"><div class="flex max-w-[980px] flex-col gap-1 pr-2"><h2 class="text-3xl font-semibold tracking-tight">Models</h2><div class="text-secondary text-sm">Start with <!-- -->GPT-5.6 Sol<!-- --> for complex reasoning and coding, choose <!-- -->GPT-5.6 Terra<!-- --> to balance intelligence and cost, or use <!-- -->GPT-5.6 Luna<!-- --> for cost-sensitive, high-volume workloads.</div></div><div class="mt-2 md:mt-0"><a href="/api/docs/models" class="_Button_6dmow_1 text-sm text-[var(--color-text-secondary)] hover:text-[var(--color-text-emphasis)]" data-color="primary" data-variant="ghost" data-size="md"><span class="_ButtonInner_6dmow_4">View all</span></a></div></div><div class="grid grid-cols-1 gap-6 md:grid-cols-2 md:gap-x-10 xl:grid-cols-3"><div class="flex flex-col text-emphasis"><a href="/api/docs/models/gpt-5.6-sol" class="flex flex-col text-emphasis no-underline hover:text-emphasis hover:no-underline"><div class="h-[180px] w-full"><div class="flex h-full w-full flex-1 cursor-pointer flex-row items-center justify-center gap-4 rounded-lg" style="background-image:url(/images/api/models/gpt-5.6-sol.jpg);background-color:var(--color-background-primary-soft);background-size:cover;background-position:center"></div></div><div class="mt-5 flex flex-col gap-1"><div class="flex items-center gap-1.5 text-base font-semibold text-emphasis"><span>GPT-5.6 Sol</span></div><div class="text-sm text-secondary">Frontier model for complex professional work</div></div></a></div><div class="flex flex-col text-emphasis"><a href="/api/docs/models/gpt-5.6-terra" class="flex flex-col text-emphasis no-underline hover:text-emphasis hover:no-underline"><div class="h-[180px] w-full"><div class="flex h-full w-full flex-1 cursor-pointer flex-row items-center justify-center gap-4 rounded-lg" style="background-image:url(/images/api/models/gpt-5.6-terra.jpg);background-color:var(--color-background-primary-soft);background-size:cover;background-position:center"></div></div><div class="mt-5 flex flex-col gap-1"><div class="flex items-center gap-1.5 text-base font-semibold text-emphasis"><span>GPT-5.6 Terra</span></div><div class="text-sm text-secondary">GPT-5.6 model that balances intelligence and cost</div></div></a></div><div class="flex flex-col text-emphasis"><a href="/api/docs/models/gpt-5.6-luna" class="flex flex-col text-emphasis no-underline hover:text-emphasis hover:no-underline"><div class="h-[180px] w-full"><div class="flex h-full w-full flex-1 cursor-pointer flex-row items-center justify-center gap-4 rounded-lg" style="background-image:url(/images/api/models/gpt-5.6-luna.jpg);background-color:var(--color-background-primary-soft);background-size:cover;background-position:center"></div></div><div class="mt-5 flex flex-col gap-1"><div class="flex items-center gap-1.5 text-base font-semibold text-emphasis"><span>GPT-5.6 Luna</span></div><div class="text-sm text-secondary">GPT-5.6 model optimized for cost-sensitive workloads</div></div></a></div></div></div><section class="flex flex-col gap-4"><h2 class="text-lg font-semibold text-[var(--color-text-emphasis)]">Start building</h2><div class="grid gap-6 md:grid-cols-2"><a href="/api/docs/guides/text" class="block text-[var(--color-text-emphasis)] no-underline hover:no-underline"><div class="icon-item"><div class="icon-item-icon"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path d="M12 4.5C7.5271 4.5 4 7.91095 4 12C4 13.6958 4.5996 15.263 5.62036 16.5254C5.80473 16.7534 5.87973 17.0509 5.82551 17.339C5.72928 17.8505 5.60336 18.3503 5.45668 18.8401C6.08722 18.743 6.69878 18.6098 7.2983 18.4395C7.54758 18.3687 7.81461 18.3975 8.04312 18.5197C9.20727 19.1423 10.5566 19.5 12 19.5C16.4729 19.5 20 16.0891 20 12C20 7.91095 16.4729 4.5 12 4.5ZM2 12C2 6.70021 6.53177 2.5 12 2.5C17.4682 2.5 22 6.70021 22 12C22 17.2998 17.4682 21.5 12 21.5C10.3694 21.5 8.82593 21.1286 7.46141 20.4675C6.36717 20.7507 5.2423 20.9253 4.06155 20.9981C3.72191 21.019 3.39493 20.8658 3.19366 20.5915C2.9924 20.3171 2.94448 19.9592 3.06647 19.6415C3.35663 18.8859 3.6004 18.1448 3.77047 17.399C2.65693 15.8695 2 14.0088 2 12Z" fill="currentColor"></path></svg></div><div class="icon-item-right"><div class="icon-item-title"><div class="icon-item-title body-large">Read and generate text</div><div class="pointer"><svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.293 7.293a1 1 0 0 1 1.414 0l4 4a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414L12.586 12 9.293 8.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"></path></svg></div></div><div class="icon-item-desc body-small">Use the API to prompt a model and generate text</div></div></div></a><a href="/api/docs/guides/images-vision" class="block text-[var(--color-text-emphasis)] no-underline hover:no-underline"><div class="icon-item"><div class="icon-item-icon"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path d="M5.91456 7.59106C4.34202 9.04124 3.28878 10.7415 2.77064 11.6971C2.66597 11.8902 2.66597 12.1098 2.77064 12.3029C3.28878 13.2585 4.34202 14.9588 5.91456 16.4089C7.48207 17.8545 9.50584 19 12.0001 19C14.4944 19 16.5182 17.8545 18.0857 16.4089C19.6582 14.9588 20.7114 13.2585 21.2296 12.3029C21.3343 12.1098 21.3343 11.8902 21.2296 11.6971C20.7114 10.7415 19.6582 9.04124 18.0857 7.59105C16.5182 6.1455 14.4944 5 12.0001 5C9.50584 5 7.48207 6.1455 5.91456 7.59106ZM4.5587 6.1208C6.36071 4.45899 8.84593 3 12.0001 3C15.1543 3 17.6395 4.45899 19.4415 6.1208C21.2385 7.77798 22.4153 9.68799 22.9878 10.7438C23.4149 11.5315 23.4149 12.4685 22.9878 13.2562C22.4153 14.312 21.2385 16.222 19.4415 17.8792C17.6395 19.541 15.1543 21 12.0001 21C8.84593 21 6.36071 19.541 4.5587 17.8792C2.76171 16.222 1.5849 14.312 1.01244 13.2562C0.585372 12.4685 0.585371 11.5315 1.01244 10.7438C1.5849 9.688 2.76171 7.77798 4.5587 6.1208ZM12.0001 9.5C10.6194 9.5 9.50011 10.6193 9.50011 12C9.50011 13.3807 10.6194 14.5 12.0001 14.5C13.3808 14.5 14.5001 13.3807 14.5001 12C14.5001 10.6193 13.3808 9.5 12.0001 9.5ZM7.50011 12C7.50011 9.51472 9.51483 7.5 12.0001 7.5C14.4854 7.5 16.5001 9.51472 16.5001 12C16.5001 14.4853 14.4854 16.5 12.0001 16.5C9.51483 16.5 7.50011 14.4853 7.50011 12Z" fill="currentColor"></path></svg></div><div class="icon-item-right"><div class="icon-item-title"><div class="icon-item-title body-large">Use a model&#x27;s vision capabilities</div><div class="pointer"><svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.293 7.293a1 1 0 0 1 1.414 0l4 4a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414L12.586 12 9.293 8.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"></path></svg></div></div><div class="icon-item-desc body-small">Allow models to see and analyze images in your application</div></div></div></a><a href="/api/docs/guides/image-generation" class="block text-[var(--color-text-emphasis)] no-underline hover:no-underline"><div class="icon-item"><div class="icon-item-icon"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path d="M12.1796 11.8179C12.2949 12.6383 11.7233 13.3968 10.903 13.5121C10.0826 13.6274 9.32409 13.0558 9.20879 12.2354C9.0935 11.4151 9.66507 10.6566 10.4854 10.5413C11.3058 10.426 12.0643 10.9976 12.1796 11.8179Z" fill="currentColor"></path><path d="M14.2794 1.70738L17.736 2.1318C18.535 2.22989 19.1944 2.31084 19.7262 2.42069C20.2785 2.53477 20.7793 2.69557 21.2309 3.00017C21.9312 3.47253 22.464 4.15446 22.7529 4.94824C22.9392 5.46009 22.9741 5.98496 22.9511 6.54846C22.9291 7.09101 22.8481 7.75041 22.75 8.54938L22.3256 12.006C22.2275 12.805 22.1465 13.4644 22.0367 13.9962C21.9226 14.5485 21.7618 15.0493 21.4572 15.5009C20.9848 16.2012 20.3029 16.734 19.5091 17.0229C19.4277 17.0525 19.3454 17.0786 19.2619 17.1012C18.7289 17.2459 18.1796 16.931 18.035 16.398C17.8903 15.865 18.2051 15.3157 18.7381 15.171C18.7686 15.1628 18.7974 15.1536 18.8251 15.1435C19.222 14.9991 19.5629 14.7327 19.7991 14.3825C19.8973 14.237 19.989 14.0224 20.078 13.5916C20.1694 13.1493 20.2411 12.5715 20.3455 11.7213L20.7599 8.34664C20.8642 7.49645 20.9344 6.9184 20.9528 6.46718C20.9707 6.02767 20.9335 5.79722 20.8735 5.63228C20.7291 5.23539 20.4627 4.89442 20.1125 4.65824C19.967 4.56009 19.7524 4.46832 19.3216 4.37934C18.8793 4.28799 18.3015 4.21625 17.4513 4.11186L14.0766 3.69751C13.2264 3.59311 12.6484 3.52292 12.1972 3.50457C11.7577 3.48669 11.5272 3.52381 11.3623 3.58385C10.9654 3.7283 10.6244 3.9947 10.3882 4.34485C10.3214 4.44397 10.2574 4.57566 10.1956 4.78417C10.0387 5.31369 9.48218 5.61574 8.95265 5.45882C8.42313 5.30189 8.12108 4.74542 8.27801 4.2159C8.38283 3.86218 8.52321 3.53326 8.73015 3.22646C9.20251 2.52616 9.88445 1.99337 10.6782 1.70446C11.1901 1.51816 11.7149 1.4833 12.2784 1.50622C12.821 1.52829 13.4804 1.60927 14.2794 1.70738ZM11.7602 8.80029C11.309 8.81864 10.7309 8.88883 9.88073 8.99322L6.50608 9.40758C5.65588 9.51197 5.07802 9.5837 4.63577 9.67505C4.20499 9.76404 3.99037 9.8558 3.84485 9.95396C3.4947 10.1901 3.2283 10.5311 3.08385 10.928C3.02381 11.0929 2.98669 11.3234 3.00457 11.7629C3.02292 12.2141 3.09311 12.7922 3.19751 13.6424L3.47503 15.9026C3.68383 15.676 3.87699 15.4746 4.05931 15.3001C4.45033 14.9256 4.84957 14.6163 5.33514 14.4178C6.09046 14.1092 6.92211 14.0389 7.71853 14.2164C8.23053 14.3305 8.67603 14.5684 9.12435 14.8719C9.55516 15.1635 10.0505 15.5598 10.6493 16.0389L14.3141 18.9707C14.4548 18.7983 14.5665 18.6025 14.6435 18.3908C14.7036 18.2259 14.7407 17.9954 14.7228 17.5559C14.7045 17.1047 14.6343 16.5266 14.5299 15.6764L14.1155 12.3018C14.0111 11.4516 13.9394 10.8737 13.848 10.4315C13.7591 10.0007 13.6673 9.78609 13.5691 9.64056C13.333 9.29041 12.992 9.02402 12.5951 8.87956C12.4302 8.81953 12.1997 8.78241 11.7602 8.80029ZM12.1431 19.7952L9.43119 17.6256C8.79321 17.1152 8.36009 16.7697 8.00329 16.5282C7.65652 16.2934 7.45002 16.2056 7.28344 16.1685C6.88523 16.0797 6.46941 16.1149 6.09175 16.2692C5.93377 16.3338 5.74494 16.455 5.4425 16.7446C5.1313 17.0426 4.76232 17.456 4.21908 18.0662L3.81279 18.5226C3.83428 18.6544 3.85618 18.7752 3.87934 18.8873C3.96832 19.3181 4.06009 19.5327 4.15824 19.6782C4.39442 20.0284 4.73539 20.2948 5.13228 20.4392C5.29722 20.4993 5.52767 20.5364 5.96718 20.5185C6.4184 20.5002 6.99645 20.43 7.84664 20.3256L11.2213 19.9112C11.5716 19.8682 11.8757 19.8307 12.1431 19.7952ZM11.6789 6.80194C12.2424 6.77902 12.7673 6.81388 13.2791 7.00018C14.0729 7.28909 14.7548 7.82188 15.2272 8.52218C15.5318 8.97376 15.6926 9.4746 15.8067 10.0269C15.9165 10.5587 15.9975 11.2181 16.0956 12.0171L16.52 15.4736C16.6181 16.2726 16.6991 16.9321 16.7212 17.4746C16.7441 18.0381 16.7092 18.563 16.5229 19.0749C16.234 19.8686 15.7012 20.5506 15.0009 21.0229C14.5493 21.3275 14.0485 21.4883 13.4962 21.6024C12.9644 21.7122 12.305 21.7932 11.506 21.8913L8.04937 22.3157C7.25041 22.4138 6.59101 22.4948 6.04846 22.5169C5.48496 22.5398 4.96009 22.5049 4.44824 22.3186C3.65446 22.0297 2.97253 21.4969 2.50017 20.7966C2.19557 20.345 2.03477 19.8442 1.92069 19.2919C1.81084 18.7601 1.72989 18.1007 1.6318 17.3017L1.20738 13.8451C1.10927 13.0461 1.02829 12.3867 1.00622 11.8442C0.983303 11.2807 1.01816 10.7558 1.20446 10.244C1.49337 9.45018 2.02616 8.76824 2.72646 8.29588C3.17804 7.99129 3.67888 7.83049 4.23119 7.7164C4.76296 7.60656 5.42236 7.52561 6.22133 7.42752L9.67798 7.0031C10.4769 6.90498 11.1364 6.82401 11.6789 6.80194Z" fill="currentColor"></path></svg></div><div class="icon-item-right"><div class="icon-item-title"><div class="icon-item-title body-large">Generate images as output</div><div class="pointer"><svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.293 7.293a1 1 0 0 1 1.414 0l4 4a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414L12.586 12 9.293 8.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"></path></svg></div></div><div class="icon-item-desc body-small">Create images with GPT Image 2</div></div></div></a><a href="/api/docs/guides/audio" class="block text-[var(--color-text-emphasis)] no-underline hover:no-underline"><div class="icon-item"><div class="icon-item-icon"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path d="M4 15.8333V17.1667C4 18.4553 5.04467 19.5 6.33333 19.5C6.70152 19.5 7 19.2015 7 18.8333V14.1667C7 13.7985 6.70152 13.5 6.33333 13.5C5.04467 13.5 4 14.5447 4 15.8333ZM2 12.5C2 6.97715 6.47715 2.5 12 2.5C17.5228 2.5 22 6.97715 22 12.5V17.1667C22 19.5599 20.0599 21.5 17.6667 21.5C16.1939 21.5 15 20.3061 15 18.8333V14.1667C15 12.6939 16.1939 11.5 17.6667 11.5C18.523 11.5 19.3214 11.7484 19.9936 12.1771C19.8242 7.90854 16.3101 4.5 12 4.5C7.68986 4.5 4.17583 7.90854 4.0064 12.1771C4.6786 11.7484 5.47696 11.5 6.33333 11.5C7.80609 11.5 9 12.6939 9 14.1667V18.8333C9 20.3061 7.80609 21.5 6.33333 21.5C3.9401 21.5 2 19.5599 2 17.1667V12.5ZM20 15.8333C20 14.5447 18.9553 13.5 17.6667 13.5C17.2985 13.5 17 13.7985 17 14.1667V18.8333C17 19.2015 17.2985 19.5 17.6667 19.5C18.9553 19.5 20 18.4553 20 17.1667V15.8333Z" fill="currentColor"></path></svg></div><div class="icon-item-right"><div class="icon-item-title"><div class="icon-item-title body-large">Build apps with audio</div><div class="pointer"><svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.293 7.293a1 1 0 0 1 1.414 0l4 4a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414L12.586 12 9.293 8.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"></path></svg></div></div><div class="icon-item-desc body-small">Analyze, transcribe, and generate audio with API endpoints</div></div></div></a><a href="/api/docs/guides/agents" class="block text-[var(--color-text-emphasis)] no-underline hover:no-underline"><div class="icon-item"><div class="icon-item-icon"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path d="M6.16146 3L17.8385 3C18.3657 2.99998 18.8205 2.99997 19.195 3.03057C19.5904 3.06287 19.9836 3.13419 20.362 3.32698C20.9265 3.6146 21.3854 4.07354 21.673 4.63803C21.8658 5.01641 21.9371 5.40963 21.9694 5.80497C22 6.17954 22 6.6343 22 7.16144V13.3386C22 13.8657 22 14.3205 21.9694 14.695C21.9371 15.0904 21.8658 15.4836 21.673 15.862C21.3854 16.4265 20.9265 16.8854 20.362 17.173C19.9836 17.3658 19.5904 17.4371 19.195 17.4694C18.8205 17.5 18.3657 17.5 17.8385 17.5H16.5V20C16.5 20.5523 16.5523 21 15.5 21H8.5C7.94772 21 7.5 20.5523 7.5 20V17.5H6.16148C5.63432 17.5 5.17955 17.5 4.80497 17.4694C4.40963 17.4371 4.01641 17.3658 3.63803 17.173C3.07354 16.8854 2.6146 16.4265 2.32698 15.862C2.13419 15.4836 2.06287 15.0904 2.03057 14.695C1.99997 14.3205 1.99998 13.8657 2 13.3385V7.16146C1.99998 6.63431 1.99997 6.17955 2.03057 5.80497C2.06287 5.40963 2.13419 5.01641 2.32698 4.63803C2.6146 4.07354 3.07354 3.6146 3.63803 3.32698C4.01641 3.13419 4.40963 3.06287 4.80497 3.03057C5.17955 2.99997 5.63431 2.99998 6.16146 3ZM9.5 17.5V19H14.5V17.5H9.5ZM4.96784 5.02393C4.69617 5.04612 4.59546 5.0838 4.54601 5.109C4.35785 5.20487 4.20487 5.35785 4.109 5.54601C4.0838 5.59546 4.04612 5.69617 4.02393 5.96784C4.00078 6.25117 4 6.62345 4 7.2V13.3C4 13.8766 4.00078 14.2488 4.02393 14.5322C4.04612 14.8038 4.0838 14.9045 4.109 14.954C4.20487 15.1422 4.35785 15.2951 4.54601 15.391C4.59546 15.4162 4.69617 15.4539 4.96784 15.4761C5.25117 15.4992 5.62345 15.5 6.2 15.5H17.8C18.3766 15.5 18.7488 15.4992 19.0322 15.4761C19.3038 15.4539 19.4045 15.4162 19.454 15.391C19.6422 15.2951 19.7951 15.1422 19.891 14.954C19.9162 14.9045 19.9539 14.8038 19.9761 14.5322C19.9992 14.2488 20 13.8766 20 13.3V7.2C20 6.62345 19.9992 6.25118 19.9761 5.96784C19.9539 5.69617 19.9162 5.59546 19.891 5.54601C19.7951 5.35785 19.6422 5.20487 19.454 5.109C19.4045 5.0838 19.3038 5.04612 19.0322 5.02393C18.7488 5.00078 18.3766 5 17.8 5H6.2C5.62345 5 5.25117 5.00078 4.96784 5.02393Z" fill="currentColor"></path></svg></div><div class="icon-item-right"><div class="icon-item-title"><div class="icon-item-title body-large">Build agentic applications</div><div class="pointer"><svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.293 7.293a1 1 0 0 1 1.414 0l4 4a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414L12.586 12 9.293 8.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"></path></svg></div></div><div class="icon-item-desc body-small">Use the API to build agents that use tools and computers</div></div></div></a><a href="/api/docs/guides/reasoning" class="block text-[var(--color-text-emphasis)] no-underline hover:no-underline"><div class="icon-item"><div class="icon-item-icon"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.932 4.377A1.45 1.45 0 0 1 11.375 3c.8 0 1.403.638 1.443 1.377.205 3.787 3.003 6.59 6.784 6.794A1.474 1.474 0 0 1 21 12.636c0 .816-.655 1.428-1.406 1.465-3.775.187-6.571 2.985-6.776 6.772a1.45 1.45 0 0 1-1.443 1.377 1.45 1.45 0 0 1-1.443-1.377c-.205-3.787-3.002-6.585-6.777-6.772a1.472 1.472 0 0 1-1.405-1.464c0-.815.654-1.426 1.404-1.464 3.772-.187 6.573-3.004 6.778-6.796Zm1.443 2.87a8.875 8.875 0 0 1-5.395 5.389 8.847 8.847 0 0 1 5.395 5.369 8.847 8.847 0 0 1 5.41-5.374 8.884 8.884 0 0 1-5.41-5.384Z" clip-rule="evenodd"></path><path fill-rule="evenodd" d="M19.25 3.75a1 1 0 1 0 0 2 1 1 0 0 0 0-2Zm-3 1a3 3 0 1 1 6 0 3 3 0 0 1-6 0Z" clip-rule="evenodd"></path></svg></div><div class="icon-item-right"><div class="icon-item-title"><div class="icon-item-title body-large">Achieve complex tasks with reasoning</div><div class="pointer"><svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.293 7.293a1 1 0 0 1 1.414 0l4 4a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414L12.586 12 9.293 8.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"></path></svg></div></div><div class="icon-item-desc body-small">Use reasoning models to carry out complex tasks</div></div></div></a><a href="/api/docs/guides/structured-outputs" class="block text-[var(--color-text-emphasis)] no-underline hover:no-underline"><div class="icon-item"><div class="icon-item-icon"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path d="M6.00633 5.5C6.02321 5.53319 6.07042 5.60366 6.19525 5.70906C6.42458 5.9027 6.81573 6.12215 7.38659 6.32603C8.5196 6.73067 10.1506 7 12 7C13.8494 7 15.4804 6.73067 16.6134 6.32603C17.1843 6.12215 17.5754 5.9027 17.8048 5.70906C17.9296 5.60366 17.9768 5.53319 17.9937 5.5C17.9768 5.46681 17.9296 5.39634 17.8048 5.29094C17.5754 5.0973 17.1843 4.87785 16.6134 4.67397C15.4804 4.26933 13.8494 4 12 4C10.1506 4 8.5196 4.26933 7.38659 4.67397C6.81573 4.87785 6.42458 5.0973 6.19525 5.29094C6.07042 5.39634 6.02321 5.46681 6.00633 5.5ZM18 7.91726C17.7726 8.02403 17.5333 8.12123 17.2861 8.20951C15.8856 8.70968 14.0166 9 12 9C9.98341 9 8.1144 8.70968 6.71392 8.20951C6.46674 8.12123 6.22738 8.02403 6 7.91726V11.9866C6.00813 12.0073 6.03931 12.0661 6.14259 12.1624C6.31976 12.3277 6.63181 12.5252 7.10609 12.7189C8.04837 13.1039 9.43027 13.3932 11.051 13.476C11.6026 13.5042 12.0269 13.9741 11.9987 14.5257C11.9705 15.0773 11.5005 15.5016 10.949 15.4734C9.17744 15.3829 7.55934 15.0646 6.34969 14.5704C6.23097 14.5219 6.11419 14.4709 6 14.4173V18.4866C6.00813 18.5073 6.03931 18.5661 6.14259 18.6624C6.31976 18.8277 6.63181 19.0252 7.10609 19.2189C8.04837 19.6039 9.43027 19.8932 11.051 19.976C11.6026 20.0042 12.0269 20.4741 11.9987 21.0257C11.9705 21.5773 11.5005 22.0016 10.949 21.9734C9.17744 21.8829 7.55934 21.5646 6.34969 21.0704C5.74801 20.8246 5.19611 20.5146 4.77833 20.1249C4.35948 19.7341 4 19.1866 4 18.5V5.5C4 4.74631 4.43048 4.16346 4.90494 3.76283C5.38405 3.35829 6.01803 3.03902 6.71392 2.79049C8.1144 2.29032 9.98341 2 12 2C14.0166 2 15.8856 2.29032 17.2861 2.79049C17.982 3.03902 18.616 3.35829 19.0951 3.76283C19.5695 4.16346 20 4.74631 20 5.5V10C20 10.5523 19.5523 11 19 11C18.4477 11 18 10.5523 18 10V7.91726Z" fill="currentColor"></path><path d="M17.4635 13H18.5364C18.8205 13 19.0802 13.1605 19.2072 13.4146L19.7416 14.4833L20.9344 14.4118C21.218 14.3947 21.4868 14.5394 21.6288 14.7854L22.1653 15.7146C22.3074 15.9606 22.2982 16.2658 22.1417 16.5028L21.4833 17.5L22.1417 18.4972C22.2982 18.7342 22.3074 19.0394 22.1653 19.2854L21.6289 20.2146C21.4868 20.4606 21.218 20.6053 20.9344 20.5882L19.7416 20.5167L19.2072 21.5854C19.0802 21.8395 18.8205 22 18.5364 22H17.4635C17.1794 22 16.9197 21.8395 16.7926 21.5854L16.2583 20.5167L15.0655 20.5883C14.782 20.6053 14.5131 20.4606 14.3711 20.2146L13.8346 19.2854C13.6926 19.0394 13.7017 18.7342 13.8582 18.4972L14.5166 17.5L13.8583 16.5028C13.7017 16.2658 13.6926 15.9606 13.8346 15.7146L14.3711 14.7854C14.5131 14.5394 14.782 14.3947 15.0656 14.4117L16.2583 14.4833L16.7926 13.4146C16.9197 13.1605 17.1794 13 17.4635 13ZM17.9999 19C18.8284 19 19.4999 18.3284 19.4999 17.5C19.4999 16.6716 18.8284 16 17.9999 16C17.1715 16 16.4999 16.6716 16.4999 17.5C16.4999 18.3284 17.1715 19 17.9999 19Z" fill="currentColor"></path></svg></div><div class="icon-item-right"><div class="icon-item-title"><div class="icon-item-title body-large">Get structured data from models</div><div class="pointer"><svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.293 7.293a1 1 0 0 1 1.414 0l4 4a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414L12.586 12 9.293 8.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"></path></svg></div></div><div class="icon-item-desc body-small">Use Structured Outputs to get model responses that adhere to a JSON schema</div></div></div></a><a href="/api/docs/guides/model-optimization" class="block text-[var(--color-text-emphasis)] no-underline hover:no-underline"><div class="icon-item"><div class="icon-item-icon"><svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M14.5 5a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm-3.874 1a4.002 4.002 0 0 1 7.748 0H20a1 1 0 1 1 0 2h-1.626a4.002 4.002 0 0 1-7.748 0H4a1 1 0 0 1 0-2h6.626ZM9.5 15a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm-3.874 1a4.002 4.002 0 0 1 7.748 0H20a1 1 0 1 1 0 2h-6.626a4.002 4.002 0 0 1-7.748 0H4a1 1 0 1 1 0-2h1.626Z" clip-rule="evenodd"></path></svg></div><div class="icon-item-right"><div class="icon-item-title"><div class="icon-item-title body-large">Tailor to your use case</div><div class="pointer"><svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M9.293 7.293a1 1 0 0 1 1.414 0l4 4a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414L12.586 12 9.293 8.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"></path></svg></div></div><div class="icon-item-desc body-small">Adjust our models to perform specifically for your use case with fine-tuning, evals, and distillation</div></div></div></a></div></section><section class="pt-8"><div class="grid gap-4 md:grid-cols-2 xl:grid-cols-4"><a href="https://help.openai.com" target="_blank" rel="noopener noreferrer" class="group relative flex h-full flex-col items-center rounded-xl border border-transparent p-4 text-center text-[var(--color-text-emphasis)] transition hover:border-[var(--color-background-primary-soft)] hover:bg-[var(--card-gradient-hover)]"><div class="absolute right-3 top-3 flex translate-x-1 translate-y-1 opacity-0 transition group-hover:translate-x-0 group-hover:translate-y-0 group-hover:opacity-100"><svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor" data-external-link-indicator="true"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></div><div class="flex h-10 w-10 items-center justify-center text-[var(--color-text)]"><svg width="24px" height="24px" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16ZM2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12Z" clip-rule="evenodd"></path><path fill-rule="evenodd" d="M12 9a1 1 0 0 0-.879.522 1 1 0 0 1-1.754-.96A3 3 0 0 1 12 7c1.515 0 2.567 1.006 2.866 2.189.302 1.189-.156 2.574-1.524 3.258A.618.618 0 0 0 13 13a1 1 0 1 1-2 0c0-.992.56-1.898 1.447-2.342.455-.227.572-.618.48-.978C12.836 9.314 12.529 9 12 9Z" clip-rule="evenodd"></path><path d="M13.1 16a1.1 1.1 0 1 1-2.2 0 1.1 1.1 0 0 1 2.2 0Z"></path></svg></div><div class="mt-3 text-sm font-semibold">Help center</div><div class="mt-2 text-sm text-[var(--color-text-secondary)]">Frequently asked account and billing questions</div></a><a href="https://community.openai.com/" target="_blank" rel="noopener noreferrer" class="group relative flex h-full flex-col items-center rounded-xl border border-transparent p-4 text-center text-[var(--color-text-emphasis)] transition hover:border-[var(--color-background-primary-soft)] hover:bg-[var(--card-gradient-hover)]"><div class="absolute right-3 top-3 flex translate-x-1 translate-y-1 opacity-0 transition group-hover:translate-x-0 group-hover:translate-y-0 group-hover:opacity-100"><svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor" data-external-link-indicator="true"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></div><div class="flex h-10 w-10 items-center justify-center text-[var(--color-text)]"><svg width="24px" height="24px" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M8.522 6.536a7.25 7.25 0 1 1 11.996 8.106l.83 1.328a1 1 0 0 1-.848 1.53h-5.044a7.246 7.246 0 0 1-6.389 3.498A1.004 1.004 0 0 1 9 21H3.5a1 1 0 0 1-.848-1.53l.83-1.328a7.25 7.25 0 0 1 5.04-11.606Zm2.372.151a7.253 7.253 0 0 1 5.393 8.813h2.409l-.261-.417a1 1 0 0 1 .123-1.219 5.25 5.25 0 1 0-7.664-7.177ZM8.895 19a.997.997 0 0 1 .141-.004A5.25 5.25 0 1 0 4 13.75c0 1.401.547 2.672 1.442 3.614a1 1 0 0 1 .123 1.219l-.26.417h3.59Z" clip-rule="evenodd"></path></svg></div><div class="mt-3 text-sm font-semibold">Developer forum</div><div class="mt-2 text-sm text-[var(--color-text-secondary)]">Discuss topics with other developers</div></a><a href="/cookbook" target="_blank" rel="noopener noreferrer" class="group relative flex h-full flex-col items-center rounded-xl border border-transparent p-4 text-center text-[var(--color-text-emphasis)] transition hover:border-[var(--color-background-primary-soft)] hover:bg-[var(--card-gradient-hover)]"><div class="absolute right-3 top-3 flex translate-x-1 translate-y-1 opacity-0 transition group-hover:translate-x-0 group-hover:translate-y-0 group-hover:opacity-100"><svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor" data-external-link-indicator="true"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></div><div class="flex h-10 w-10 items-center justify-center text-[var(--color-text)]"><svg width="24px" height="24px" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M4 5a3 3 0 0 1 3-3h10a3 3 0 0 1 3 3v14a3 3 0 0 1-3 3H7a3 3 0 0 1-3-3v-2a1 1 0 1 1 0-2v-2a1 1 0 1 1 0-2V9a1 1 0 0 1 0-2V5Zm2 4a1 1 0 0 0 0-2V5a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1v-2a1 1 0 1 0 0-2v-2a1 1 0 1 0 0-2V9Zm3-1a1 1 0 0 1 1-1h4a1 1 0 1 1 0 2h-4a1 1 0 0 1-1-1Zm0 4a1 1 0 0 1 1-1h4a1 1 0 1 1 0 2h-4a1 1 0 0 1-1-1Z" clip-rule="evenodd"></path></svg></div><div class="mt-3 text-sm font-semibold">Cookbook</div><div class="mt-2 text-sm text-[var(--color-text-secondary)]">Open-source collection of examples and guides</div></a><a href="https://status.openai.com" target="_blank" rel="noopener noreferrer" class="group relative flex h-full flex-col items-center rounded-xl border border-transparent p-4 text-center text-[var(--color-text-emphasis)] transition hover:border-[var(--color-background-primary-soft)] hover:bg-[var(--card-gradient-hover)]"><div class="absolute right-3 top-3 flex translate-x-1 translate-y-1 opacity-0 transition group-hover:translate-x-0 group-hover:translate-y-0 group-hover:opacity-100"><svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor" data-external-link-indicator="true"><path fill-rule="evenodd" d="M16.243 6.757a1 1 0 0 1 1 1v7.072a1 1 0 0 1-2 0v-4.657L8.464 16.95a1 1 0 0 1-1.414-1.414l6.778-6.779H9.172a1 1 0 0 1 0-2h7.07Z" clip-rule="evenodd"></path></svg></div><div class="flex h-10 w-10 items-center justify-center text-[var(--color-text)]"><svg width="24px" height="24px" viewBox="0 0 24 24" fill="currentColor"><path d="M6.34354 4.92894C6.7341 5.31946 6.7341 5.95263 6.34354 6.34315C3.21906 9.46735 3.21906 14.5327 6.34354 17.6569C6.7341 18.0474 6.7341 18.6806 6.34354 19.0711C5.95298 19.4616 5.31976 19.4616 4.9292 19.0711C1.0236 15.1658 1.0236 8.83418 4.9292 4.92894C5.31976 4.53842 5.95298 4.53842 6.34354 4.92894ZM17.6583 4.92894C18.0488 4.53842 18.682 4.53842 19.0726 4.92894C22.9782 8.83418 22.9782 15.1658 19.0726 19.0711C18.682 19.4616 18.0488 19.4616 17.6583 19.0711C17.2677 18.6806 17.2677 18.0474 17.6583 17.6569C20.7827 14.5327 20.7827 9.46735 17.6583 6.34315C17.2677 5.95263 17.2677 5.31946 17.6583 4.92894Z" fill="currentColor"></path><path d="M9.17222 7.75737C9.56278 8.14789 9.56278 8.78106 9.17222 9.17158C7.60998 10.7337 7.60998 13.2663 9.17222 14.8284C9.56278 15.219 9.56278 15.8521 9.17222 16.2426C8.78166 16.6332 8.14844 16.6332 7.75788 16.2426C5.41452 13.8995 5.41452 10.1005 7.75788 7.75737C8.14844 7.36684 8.78166 7.36684 9.17222 7.75737ZM14.8296 7.75737C15.2201 7.36684 15.8534 7.36684 16.2439 7.75737C18.5873 10.1005 18.5873 13.8995 16.2439 16.2426C15.8534 16.6332 15.2201 16.6332 14.8296 16.2426C14.439 15.8521 14.439 15.219 14.8296 14.8284C16.3918 13.2663 16.3918 10.7337 14.8296 9.17158C14.439 8.78106 14.439 8.14789 14.8296 7.75737Z" fill="currentColor"></path><path d="M14.0011 12C14.0011 13.1046 13.1056 14 12.0009 14C10.8962 14 10.0007 13.1046 10.0007 12C10.0007 10.8954 10.8962 10 12.0009 10C13.1056 10 14.0011 10.8954 14.0011 12Z" fill="currentColor"></path></svg></div><div class="mt-3 text-sm font-semibold">Status</div><div class="mt-2 text-sm text-[var(--color-text-secondary)]">Check the status of OpenAI services</div></a></div></section></div></section><!--astro:end--></astro-island>   </main> </div> </div> <script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event("astro:only"));})();</script><astro-island uid="DQ4jb" component-url="/_astro/Analytics.rv0FwEeX.js" component-export="default" renderer-url="/_astro/client.DzaVUh_8.js" props="{}" ssr client="only" opts="{&quot;name&quot;:&quot;VercelAnalyticsClient&quot;,&quot;value&quot;:&quot;solid-js&quot;}"></astro-island> <vercel-speed-insights data-props="{}" data-params="{}" data-pathname="/api/docs/"></vercel-speed-insights> <script type="module">var o="@vercel/speed-insights",u="1.3.1",f=()=>{window.si||(window.si=function(...r){(window.siq=window.siq||[]).push(r)})};function l(){return typeof window<"u"}function h(){try{const e="production"}catch{}return"production"}function d(){return h()==="development"}function v(e,r){if(!e||!r)return e;let n=e;try{const t=Object.entries(r);for(const[s,i]of t)if(!Array.isArray(i)){const a=c(i);a.test(n)&&(n=n.replace(a,`/[${s}]`))}for(const[s,i]of t)if(Array.isArray(i)){const a=c(i.join("/"));a.test(n)&&(n=n.replace(a,`/[...${s}]`))}return n}catch{return e}}function c(e){return new RegExp(`/${g(e)}(?=[/?#]|$)`)}function g(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function m(e){return e.scriptSrc?e.scriptSrc:d()?"https://va.vercel-scripts.com/v1/speed-insights/script.debug.js":e.dsn?"https://va.vercel-scripts.com/v1/speed-insights/script.js":e.basePath?`${e.basePath}/speed-insights/script.js`:"/_vercel/speed-insights/script.js"}function w(e={}){var r;if(!l()||e.route===null)return null;f();const n=m(e);if(document.head.querySelector(`script[src*="${n}"]`))return null;e.beforeSend&&((r=window.si)==null||r.call(window,"beforeSend",e.beforeSend));const t=document.createElement("script");return t.src=n,t.defer=!0,t.dataset.sdkn=o+(e.framework?`/${e.framework}`:""),t.dataset.sdkv=u,e.sampleRate&&(t.dataset.sampleRate=e.sampleRate.toString()),e.route&&(t.dataset.route=e.route),e.endpoint?t.dataset.endpoint=e.endpoint:e.basePath&&(t.dataset.endpoint=`${e.basePath}/speed-insights/vitals`),e.dsn&&(t.dataset.dsn=e.dsn),d()&&e.debug===!1&&(t.dataset.debug="false"),t.onerror=()=>{console.log(`[Vercel Speed Insights] Failed to load script from ${n}. Please check if any content blockers are enabled and try again.`)},document.head.appendChild(t),{setRoute:s=>{t.dataset.route=s??void 0}}}function p(){try{return}catch{}}customElements.define("vercel-speed-insights",class extends HTMLElement{constructor(){super();try{const r=JSON.parse(this.dataset.props??"{}"),n=JSON.parse(this.dataset.params??"{}"),t=v(this.dataset.pathname??"",n);w({route:t,...r,framework:"astro",basePath:p(),beforeSend:window.speedInsightsBeforeSend})}catch(r){throw new Error(`Failed to parse SpeedInsights properties: ${r}`)}}});</script> <div data-docs-agent-root data-chatkit-api-url="/api/docs-agent/chatkit" data-chatkit-domain-key="domain_pk_69f4ea0d87748194b9ad4d8ba39fc5710f6f8241026056cb" data-docs-agent-site-domain="developers" data-chatkit-greeting="What can I help you with?" data-chatkit-start-prompts-by-route="{&#34;home&#34;:[{&#34;label&#34;:&#34;Ask a question&#34;,&#34;prompt&#34;:&#34;What is the Docs MCP server?&#34;,&#34;icon&#34;:&#34;circle-question&#34;},{&#34;label&#34;:&#34;Find a page&#34;,&#34;prompt&#34;:&#34;Show me OpenAI models&#34;,&#34;icon&#34;:&#34;search&#34;},{&#34;label&#34;:&#34;Build a custom app&#34;,&#34;prompt&#34;:&#34;I want to build an interactive webapp that has a huge microphone in the center allowing to chat in Realtime&#34;,&#34;icon&#34;:&#34;square-code&#34;}],&#34;api&#34;:[{&#34;label&#34;:&#34;Ask a question&#34;,&#34;prompt&#34;:&#34;What are the recommended prompting best practices for building with the latest model?&#34;,&#34;icon&#34;:&#34;circle-question&#34;},{&#34;label&#34;:&#34;Find a page&#34;,&#34;prompt&#34;:&#34;show me a page to compare models&#34;,&#34;icon&#34;:&#34;search&#34;},{&#34;label&#34;:&#34;Build a custom app&#34;,&#34;prompt&#34;:&#34;I want to build a customer support app with realtime voice&#34;,&#34;icon&#34;:&#34;square-code&#34;}],&#34;codex&#34;:[{&#34;label&#34;:&#34;Ask a question&#34;,&#34;prompt&#34;:&#34;What's the latest model to use with ChatGPT?&#34;,&#34;icon&#34;:&#34;circle-question&#34;},{&#34;label&#34;:&#34;Find a page&#34;,&#34;prompt&#34;:&#34;Do you have guidance on prompting?&#34;,&#34;icon&#34;:&#34;search&#34;},{&#34;label&#34;:&#34;Build a custom app&#34;,&#34;prompt&#34;:&#34;I want to build an internal dashboard that gets updated with data from slack and spreadsheets and which allows to visualize weekly progress&#34;,&#34;icon&#34;:&#34;square-code&#34;}],&#34;chatgpt&#34;:[{&#34;label&#34;:&#34;Ask a question&#34;,&#34;prompt&#34;:&#34;What are best practices for building a ChatGPT app?&#34;,&#34;icon&#34;:&#34;circle-question&#34;},{&#34;label&#34;:&#34;Find a page&#34;,&#34;prompt&#34;:&#34;Show me UI guidelines for building ChatGPT apps&#34;,&#34;icon&#34;:&#34;search&#34;},{&#34;label&#34;:&#34;Build a custom app&#34;,&#34;prompt&#34;:&#34;Help me build an app in ChatGPT that proposes a quiz to users to find the best match from my list of products&#34;,&#34;icon&#34;:&#34;square-code&#34;}],&#34;resources&#34;:[{&#34;label&#34;:&#34;Ask a question&#34;,&#34;prompt&#34;:&#34;What is the Docs MCP server?&#34;,&#34;icon&#34;:&#34;circle-question&#34;},{&#34;label&#34;:&#34;Find a page&#34;,&#34;prompt&#34;:&#34;Show me the Codex meetups page&#34;,&#34;icon&#34;:&#34;search&#34;},{&#34;label&#34;:&#34;Build a custom app&#34;,&#34;prompt&#34;:&#34;I want to build an interactive webapp that has a huge microphone in the center allowing to chat in Realtime&#34;,&#34;icon&#34;:&#34;square-code&#34;}]}" data-astro-transition-persist="docs-agent-launcher" class="docs-agent-root"><button type="button" data-docs-agent-open aria-haspopup="dialog" aria-expanded="false" aria-controls="docs-agent-panel" class="fixed bottom-5 right-5 z-50 inline-flex h-11 items-center justify-center whitespace-nowrap rounded-full border border-transparent bg-primary-solid px-4 text-sm font-medium text-primary-solid shadow-[0_16px_48px_-18px_rgba(15,23,42,0.45)] transition-colors hover:bg-primary-solid-hover active:bg-primary-solid-active focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-primary-soft-active focus-visible:ring-offset-2 focus-visible:ring-offset-surface"><span>Ask AI</span></button><div id="docs-agent-panel" data-docs-agent-panel role="dialog" aria-labelledby="docs-agent-title" class="fixed inset-x-0 bottom-0 z-[80] flex h-[var(--docs-agent-drawer-height)] flex-col overflow-hidden rounded-t-2xl border border-subtle bg-surface transition-transform duration-300 ease-out md:inset-y-0 md:left-auto md:right-0 md:h-auto md:w-[var(--docs-agent-panel-width)] md:rounded-none md:border-y-0 md:border-r-0"><header class="flex h-16 shrink-0 items-center justify-between border-b border-subtle px-4"><h2 id="docs-agent-title" class="text-sm font-semibold text-default">
Docs agent
</h2><div class="flex items-center gap-1.5"><button type="button" data-docs-agent-new aria-label="Start a new docs agent chat" title="Start a new chat" class="inline-flex h-8 w-8 items-center justify-center rounded-md text-secondary transition-colors hover:bg-primary-soft-alpha hover:text-default"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24" class="h-4 w-4 " ><path fill-rule="evenodd" d="M16.793 2.793a3.121 3.121 0 1 1 4.414 4.414l-8.5 8.5A1 1 0 0 1 12 16H9a1 1 0 0 1-1-1v-3a1 1 0 0 1 .293-.707l8.5-8.5Zm3 1.414a1.121 1.121 0 0 0-1.586 0L10 12.414V14h1.586l8.207-8.207a1.121 1.121 0 0 0 0-1.586ZM6 5a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-4a1 1 0 1 1 2 0v4a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V6a3 3 0 0 1 3-3h4a1 1 0 1 1 0 2H6Z" clip-rule="evenodd"></path></svg></button><button type="button" data-docs-agent-close aria-label="Close docs agent" class="inline-flex h-8 w-8 items-center justify-center rounded-md text-secondary transition-colors hover:bg-primary-soft-alpha hover:text-default"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4 " ><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></button></div></header><div class="relative min-h-0 flex-1"><p data-docs-agent-status class="absolute inset-x-4 top-4 rounded-lg border border-subtle bg-surface-secondary p-3 text-sm text-secondary">
Loading docs agent...
</p><openai-chatkit id="docs-agent-chatkit" class="block h-full w-full"></openai-chatkit></div></div></div><script>(() => {
  const registry = window.customElements;
  if (!registry || window.__docsAgentChatKitMoveGuardInstalled) return;
  window.__docsAgentChatKitMoveGuardInstalled = true;

  // Astro preserves the launcher with Element.moveBefore(). Registering this
  // callback before ChatKit is defined prevents its reconnect hooks from
  // replacing the live message-bridge iframe during that move.
  const registryPrototype = Object.getPrototypeOf(registry);
  const defineDescriptor = Object.getOwnPropertyDescriptor(
    registryPrototype,
    "define"
  );
  if (!defineDescriptor?.value) return;

  Object.defineProperty(registryPrototype, "define", {
    ...defineDescriptor,
    value(name, constructor, options) {
      if (
        name === "openai-chatkit" &&
        !("connectedMoveCallback" in constructor.prototype)
      ) {
        Object.defineProperty(
          constructor.prototype,
          "connectedMoveCallback",
          {
            configurable: true,
            value() {},
          }
        );
      }

      const result = defineDescriptor.value.call(
        this,
        name,
        constructor,
        options
      );
      if (name === "openai-chatkit") {
        Object.defineProperty(registryPrototype, "define", defineDescriptor);
      }
      return result;
    },
  });
})();</script><script src="https://cdn.platform.openai.com/deployments/chatkit/chatkit.js" async></script><script type="module" src="/_astro/DocsAgentLauncher.astro_astro_type_script_index_0_lang.B0156XLP.js"></script><script>
  function initializeDocsAgentLauncher() {
    const root = document.querySelector("[data-docs-agent-root]");
    if (!root || root.dataset.initialized === "true") return;
    if (
      typeof window.__createDocsAgentNavigationQueue !== "function" ||
      typeof window.__getDocsAgentNavigationTarget !== "function"
    ) {
      return;
    }

    const mobileOpenButton = root.querySelector("button[data-docs-agent-open]");
    const closeButton = root.querySelector("[data-docs-agent-close]");
    const newButton = root.querySelector("[data-docs-agent-new]");
    const panel = root.querySelector("[data-docs-agent-panel]");
    const status = root.querySelector("[data-docs-agent-status]");
    let chatkit = root.querySelector("openai-chatkit");
    const apiURL = root.dataset.chatkitApiUrl;
    const domainKey = root.dataset.chatkitDomainKey || "local-dev";
    const siteDomain =
      root.dataset.docsAgentSiteDomain === "chatgpt" ? "chatgpt" : "developers";
    const startGreeting =
      root.dataset.chatkitGreeting || "OpenAI developer docs";
    const startPromptsByParentRoute = (() => {
      try {
        const parsed = JSON.parse(
          root.dataset.chatkitStartPromptsByRoute || "{}"
        );
        return parsed && typeof parsed === "object" && !Array.isArray(parsed)
          ? parsed
          : {};
      } catch {
        return {};
      }
    })();
    const docsAgentSessionStorageKey = "docs-agent.chatkit-session-id";
    const uuidPattern =
      /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i;

    const randomUuid = () => {
      if (window.crypto?.randomUUID) {
        return window.crypto.randomUUID();
      }

      const bytes = new Uint8Array(16);
      if (window.crypto?.getRandomValues) {
        window.crypto.getRandomValues(bytes);
      } else {
        for (let index = 0; index < bytes.length; index += 1) {
          bytes[index] = Math.floor(Math.random() * 256);
        }
      }
      bytes[6] = (bytes[6] & 0x0f) | 0x40;
      bytes[8] = (bytes[8] & 0x3f) | 0x80;

      const hex = Array.from(bytes, (byte) =>
        byte.toString(16).padStart(2, "0")
      );
      return [
        hex.slice(0, 4).join(""),
        hex.slice(4, 6).join(""),
        hex.slice(6, 8).join(""),
        hex.slice(8, 10).join(""),
        hex.slice(10, 16).join(""),
      ].join("-");
    };

    let docsAgentSessionIdValue = null;

    const storeDocsAgentSessionId = (sessionId) => {
      docsAgentSessionIdValue = sessionId;
      try {
        window.sessionStorage.setItem(docsAgentSessionStorageKey, sessionId);
      } catch {
        // Ignore storage failures.
      }
      return sessionId;
    };

    const resetDocsAgentSessionId = () =>
      storeDocsAgentSessionId(randomUuid().toLowerCase());

    const docsAgentSessionId = () => {
      if (
        docsAgentSessionIdValue &&
        uuidPattern.test(docsAgentSessionIdValue)
      ) {
        return docsAgentSessionIdValue.toLowerCase();
      }
      try {
        const stored = window.sessionStorage.getItem(
          docsAgentSessionStorageKey
        );
        if (stored && uuidPattern.test(stored)) {
          docsAgentSessionIdValue = stored.toLowerCase();
          return docsAgentSessionIdValue;
        }
      } catch {
        // Fall through and create an in-memory session id.
      }
      return resetDocsAgentSessionId();
    };

    if (
      !mobileOpenButton ||
      !closeButton ||
      !newButton ||
      !(panel instanceof HTMLElement) ||
      !chatkit ||
      !apiURL
    ) {
      return;
    }

    let chatkitInitialized = false;
    let chatkitResponseActive = false;
    let chatkitTurnActive = false;
    let docsAgentNavigationInProgress = false;
    let chatkitReplacement = null;
    let desiredPathname = window.location.pathname || "/";
    let previousFocus = null;
    let lastPageSelection = { text: "", capturedAt: 0 };
    let conversationStartedTracked = false;

    const selectedTextLimit = 3000;
    const staleSelectionMs = 2 * 60 * 1000;
    const docsAgentRequestTimeoutMs = 40 * 1000;
    const docsAgentNavigationTimeoutMs = 8 * 1000;
    const docsAgentTransitionWaitTimeoutMs = 15 * 1000;
    const docsAgentInitializationTimeoutMs = 15 * 1000;
    const docsAgentUnavailableMessage =
      "The docs agent couldn't complete the request. Please retry.";
    const chatKitUserTurnTypes = new Set([
      "threads.create",
      "threads.add_user_message",
      "threads.retry_after_item",
    ]);
    const desktopPanelMedia = window.matchMedia("(min-width: 768px)");

    const withTimeout = (operation, timeoutMs, message) =>
      new Promise((resolve, reject) => {
        const timeout = window.setTimeout(
          () => reject(new Error(message)),
          timeoutMs
        );
        Promise.resolve(operation).then(
          (value) => {
            window.clearTimeout(timeout);
            resolve(value);
          },
          (error) => {
            window.clearTimeout(timeout);
            reject(error);
          }
        );
      });

    const requestDeadlineSignal = (existingSignal) => {
      const controller = new AbortController();
      const abort = (signal) => controller.abort(signal?.reason);
      if (existingSignal) {
        if (existingSignal.aborted) {
          abort(existingSignal);
        } else {
          existingSignal.addEventListener(
            "abort",
            () => abort(existingSignal),
            {
              once: true,
            }
          );
        }
      }
      window.setTimeout(
        () => controller.abort(new Error("Docs agent request timed out")),
        docsAgentRequestTimeoutMs
      );
      return controller.signal;
    };

    const chatKitErrorFrame = (message = docsAgentUnavailableMessage) =>
      new TextEncoder().encode(
        `data: ${JSON.stringify({
          type: "error",
          code: "custom",
          message,
          allow_retry: true,
        })}\n\n`
      );

    const chatKitErrorResponse = (message = docsAgentUnavailableMessage) =>
      new Response(chatKitErrorFrame(message), {
        status: 200,
        headers: {
          "content-type": "text/event-stream; charset=utf-8",
          "cache-control": "no-cache",
        },
      });

    const chatKitFrameHasTerminalEvent = (frame) => {
      const data = frame
        .split("\n")
        .filter((line) => line.startsWith("data: "))
        .map((line) => line.slice("data: ".length))
        .join("\n");
      if (!data) return false;
      try {
        const payload = JSON.parse(data);
        if (payload?.type === "error") return true;
        return (
          payload?.type === "thread.item.done" &&
          payload?.item?.type === "assistant_message" &&
          Array.isArray(payload.item.content) &&
          payload.item.content.some(
            (part) =>
              typeof part?.text === "string" && Boolean(part.text.trim())
          )
        );
      } catch {
        return false;
      }
    };

    const observeChatKitTerminalEvents = (state, chunk, final = false) => {
      state.buffer += chunk
        ? state.decoder.decode(chunk, { stream: !final })
        : state.decoder.decode();
      state.buffer = state.buffer.replace(/\r\n/g, "\n");
      const frames = state.buffer.split("\n\n");
      const trailingFrame = frames.pop() || "";
      state.buffer = final ? "" : trailingFrame;
      for (const frame of frames) {
        if (chatKitFrameHasTerminalEvent(frame)) state.emitted = true;
      }
      if (
        final &&
        trailingFrame &&
        chatKitFrameHasTerminalEvent(trailingFrame)
      ) {
        state.emitted = true;
      }
    };

    const ensureUserTurnTerminalResponse = (response) => {
      if (!response.body) return chatKitErrorResponse();
      const reader = response.body.getReader();
      const state = {
        decoder: new TextDecoder(),
        buffer: "",
        emitted: false,
      };
      const body = new ReadableStream({
        async pull(controller) {
          try {
            const result = await reader.read();
            if (result.done) {
              observeChatKitTerminalEvents(state, null, true);
              if (!state.emitted) controller.enqueue(chatKitErrorFrame());
              controller.close();
              return;
            }
            observeChatKitTerminalEvents(state, result.value);
            controller.enqueue(result.value);
          } catch {
            if (!state.emitted) controller.enqueue(chatKitErrorFrame());
            controller.close();
          }
        },
        cancel(reason) {
          void reader.cancel(reason).catch(() => undefined);
        },
      });
      return new Response(body, {
        status: response.status,
        statusText: response.statusText,
        headers: response.headers,
      });
    };
    const syncOpenButtons = (expanded) => {
      document
        .querySelectorAll("button[data-docs-agent-open]")
        .forEach((button) => {
          button.setAttribute("aria-expanded", expanded);
        });
    };

    const syncLayoutTargets = () => {
      const isOpen = root.dataset.open === "true";
      const isDesktopPanel = desktopPanelMedia.matches;
      document.body.classList.toggle("docs-agent-open", isOpen);
      if (isOpen) {
        document.body.dataset.docsAgentOpen = "true";
      } else {
        delete document.body.dataset.docsAgentOpen;
      }
      syncOpenButtons(isOpen ? "true" : "false");
      document.querySelectorAll("[data-docs-agent-page]").forEach((page) => {
        if (page instanceof HTMLElement) {
          page.classList.toggle("is-docs-agent-open", isOpen);
          page.style.width =
            isOpen && isDesktopPanel
              ? "calc(100% - var(--docs-agent-panel-width))"
              : "";
          page.style.transform = isOpen
            ? isDesktopPanel
              ? "none"
              : "translateY(calc(-1 * var(--docs-agent-drawer-height)))"
            : "";
        }
      });

      const header = document.getElementById("header");
      header?.classList.toggle("is-docs-agent-open", isOpen);
      if (header) {
        const headerInner = header.firstElementChild;
        const headerNav = header.querySelector("nav");
        const headerSearchButton = header.querySelector(
          "[data-header-search-button]"
        );
        header.style.width =
          isOpen && isDesktopPanel
            ? "calc(100% - var(--docs-agent-panel-width))"
            : "";
        if (headerInner instanceof HTMLElement) {
          headerInner.style.gridTemplateColumns =
            isOpen && isDesktopPanel ? "auto minmax(0, 1fr) auto" : "";
        }
        if (headerNav instanceof HTMLElement) {
          headerNav.style.minWidth = isOpen && isDesktopPanel ? "0" : "";
          headerNav.style.overflow = "";
        }
        if (headerSearchButton instanceof HTMLElement) {
          headerSearchButton.style.display =
            isOpen && isDesktopPanel ? "none" : "";
        }

        const leadingControls = headerNav?.previousElementSibling;
        const trailingControls = headerNav?.nextElementSibling;
        const marginBoxWidth = (element) => {
          const styles = window.getComputedStyle(element);
          const horizontalMargin =
            (Number.parseFloat(styles.marginLeft) || 0) +
            (Number.parseFloat(styles.marginRight) || 0);
          return element.getBoundingClientRect().width + horizontalMargin;
        };
        const contextSubnavOffset =
          isOpen &&
          isDesktopPanel &&
          leadingControls instanceof HTMLElement &&
          trailingControls instanceof HTMLElement
            ? (marginBoxWidth(leadingControls) -
                marginBoxWidth(trailingControls)) /
              2
            : 0;
        document.documentElement.style.setProperty(
          "--docs-agent-context-subnav-offset",
          `${contextSubnavOffset}px`
        );
      }

      panel.classList.toggle("is-open", isOpen);
      panel.style.transform = isOpen
        ? isDesktopPanel
          ? "translateX(0)"
          : "translateY(0)"
        : "";
    };

    const normalizeAnalyticsText = (value) =>
      typeof value === "string" ? value.replace(/\s+/g, " ").trim() : "";

    const analyticsSlug = (value, fallback) => {
      const slug = normalizeAnalyticsText(value)
        .toLowerCase()
        .replace(/[^a-z0-9]+/g, "_")
        .replace(/^_+|_+$/g, "");
      return slug || fallback;
    };

    const normalizePathname = (pathname) => {
      if (!pathname || pathname === "/") return "/";
      return pathname.replace(/\/+$/, "") || "/";
    };

    const docsAgentParentRoute = (pathname) => {
      const normalized = normalizePathname(pathname);

      if (normalized === "/") return "home";
      if (normalized === "/api" || normalized.startsWith("/api/")) {
        return "api";
      }
      if (normalized === "/codex" || normalized.startsWith("/codex/")) {
        return "codex";
      }
      if (
        normalized === "/docs" ||
        normalized.startsWith("/docs/") ||
        normalized === "/use-cases" ||
        normalized.startsWith("/use-cases/")
      ) {
        return "codex";
      }
      if (
        normalized === "/chatgpt" ||
        normalized.startsWith("/chatgpt/") ||
        normalized === "/apps-sdk" ||
        normalized.startsWith("/apps-sdk/") ||
        normalized === "/commerce" ||
        normalized.startsWith("/commerce/")
      ) {
        return "chatgpt";
      }
      if (
        normalized === "/learn" ||
        normalized.startsWith("/learn/") ||
        normalized === "/community" ||
        normalized.startsWith("/community/") ||
        normalized === "/cookbook" ||
        normalized.startsWith("/cookbook/") ||
        normalized === "/showcase" ||
        normalized.startsWith("/showcase/") ||
        normalized === "/tracks" ||
        normalized.startsWith("/tracks/") ||
        normalized === "/blog" ||
        normalized.startsWith("/blog/")
      ) {
        return "resources";
      }

      return "home";
    };

    const startPromptsForRoute = (
      pathname = window.location.pathname || "/"
    ) => {
      const parentRoute = docsAgentParentRoute(pathname);
      const prompts = startPromptsByParentRoute[parentRoute];

      if (Array.isArray(prompts)) return prompts;
      return Array.isArray(startPromptsByParentRoute.home)
        ? startPromptsByParentRoute.home
        : [];
    };

    const startPromptAnalyticsForRoute = (pathname) =>
      startPromptsForRoute(pathname)
        .map((prompt, index) => {
          const promptText = normalizeAnalyticsText(prompt?.prompt);
          if (!promptText) return null;
          return {
            id: analyticsSlug(prompt?.label, `prompt_${index + 1}`),
            label:
              normalizeAnalyticsText(prompt?.label) || `Prompt ${index + 1}`,
            position: index + 1,
            text: promptText,
          };
        })
        .filter(Boolean);

    const normalizeSelectedText = (value) =>
      value.replace(/\r\n?/g, "\n").trim().slice(0, selectedTextLimit);

    const nodeIsInDocsAgent = (node) => {
      if (!node) return false;
      const element =
        node.nodeType === Node.ELEMENT_NODE ? node : node.parentElement;
      return element instanceof Element && root.contains(element);
    };

    const currentPageSelectionText = () => {
      const selection = window.getSelection?.();
      if (!selection || selection.isCollapsed) return "";
      if (
        nodeIsInDocsAgent(selection.anchorNode) ||
        nodeIsInDocsAgent(selection.focusNode)
      ) {
        return "";
      }

      return normalizeSelectedText(selection.toString());
    };

    const rememberPageSelection = () => {
      const text = currentPageSelectionText();
      if (!text) return;
      lastPageSelection = {
        text,
        capturedAt: Date.now(),
      };
    };

    const selectedTextForAgentContext = () => {
      const text = currentPageSelectionText();
      if (text) {
        lastPageSelection = {
          text,
          capturedAt: Date.now(),
        };
        return text;
      }

      if (Date.now() - lastPageSelection.capturedAt <= staleSelectionMs) {
        return lastPageSelection.text;
      }
      return "";
    };

    const docsAgentPageContext = () => {
      const context = {
        route: `${window.location.pathname || "/"}${window.location.search}`,
        siteDomain,
      };
      const selectedText = selectedTextForAgentContext();
      if (selectedText) {
        context.selectedText = selectedText;
      }
      return context;
    };

    const hasPageSelectionForAnalytics = () => {
      if (currentPageSelectionText()) return true;
      return Date.now() - lastPageSelection.capturedAt <= staleSelectionMs
        ? Boolean(lastPageSelection.text)
        : false;
    };

    const chatKitRequestInputText = (body) => {
      const content = body?.params?.input?.content;
      if (!Array.isArray(content)) return "";

      return content
        .map((part) =>
          part?.type === "input_text" && typeof part.text === "string"
            ? part.text
            : ""
        )
        .filter(Boolean)
        .join("\n")
        .trim();
    };

    const defaultPromptMatch = (body) => {
      const text = normalizeAnalyticsText(chatKitRequestInputText(body));
      if (!text) return null;

      const startPromptByText = new Map(
        startPromptAnalyticsForRoute(window.location.pathname || "/").map(
          (prompt) => [prompt.text, prompt]
        )
      );
      return startPromptByText.get(text) || null;
    };

    const promptAnalyticsData = (prompt) =>
      prompt
        ? {
            prompt_id: prompt.id,
            prompt_label: prompt.label,
            prompt_position: prompt.position,
          }
        : {};

    const isDocsAgentApiRequest = (input) => {
      try {
        const requestUrl =
          typeof input === "string" || input instanceof URL
            ? new URL(input, window.location.href)
            : new URL(input.url);
        const configuredUrl = new URL(apiURL, window.location.href);
        return requestUrl.href === configuredUrl.href;
      } catch {
        return false;
      }
    };

    const docsAgentFetch = async (input, init) => {
      if (!isDocsAgentApiRequest(input)) {
        return window.fetch(input, init);
      }

      const nextInit = init ? { ...init } : {};
      if (typeof nextInit.body === "string") {
        try {
          const body = JSON.parse(nextInit.body);
          if (body && typeof body === "object" && !Array.isArray(body)) {
            if (body.type === "threads.create" && !conversationStartedTracked) {
              const prompt = defaultPromptMatch(body);
              const promptData = promptAnalyticsData(prompt);
              conversationStartedTracked = true;
              trackDocsAgentEvent("docs_agent_conversation_started", {
                entry_point: prompt ? "default_prompt" : "composer",
                request_type: body.type,
                has_page_selection: hasPageSelectionForAnalytics(),
                ...promptData,
              });
              if (prompt) {
                trackDocsAgentEvent("docs_agent_default_prompt_selected", {
                  request_type: body.type,
                  ...promptData,
                });
              }
            }

            const metadata =
              body.metadata &&
              typeof body.metadata === "object" &&
              !Array.isArray(body.metadata)
                ? body.metadata
                : {};
            body.metadata = {
              ...metadata,
              pageContext: docsAgentPageContext(),
            };
            nextInit.body = JSON.stringify(body);
          }
        } catch {
          // Preserve the original body if it is not JSON.
        }
      }

      const headers = new Headers(
        nextInit.headers ||
          (input instanceof Request ? input.headers : undefined)
      );
      headers.set("x-docs-agent-user", docsAgentSessionId());
      nextInit.headers = headers;
      nextInit.signal = requestDeadlineSignal(
        nextInit.signal || (input instanceof Request ? input.signal : null)
      );

      let requestType = "";
      if (typeof nextInit.body === "string") {
        try {
          requestType = JSON.parse(nextInit.body)?.type || "";
        } catch {
          // The proxy will return the protocol validation error.
        }
      }
      const requireTerminalEvent = chatKitUserTurnTypes.has(requestType);
      if (requireTerminalEvent) {
        chatkitTurnActive = true;
      }

      try {
        const response = await window.fetch(input, nextInit);
        return requireTerminalEvent
          ? ensureUserTurnTerminalResponse(response)
          : response;
      } catch (error) {
        if (requireTerminalEvent) return chatKitErrorResponse();
        throw error;
      }
    };

    const clearLegacyStoredState = () => {
      try {
        window.localStorage.removeItem("docs-agent.panel-open");
        window.localStorage.removeItem("docs-agent.thread-id");
        window.localStorage.removeItem("docs-agent.user-id");
      } catch {
        // Ignore storage failures.
      }
    };

    const showStatus = (message) => {
      if (!status) return;
      status.textContent = message;
      status.hidden = false;
    };

    const hideStatus = () => {
      if (status) status.hidden = true;
    };

    const getColorTheme = () => {
      const html = document.documentElement;
      return html.dataset.theme === "dark" || html.classList.contains("dark")
        ? "dark"
        : "light";
    };

    const normalizeClientToolArgs = (args) => {
      if (!args) return {};
      if (typeof args === "string") {
        try {
          return JSON.parse(args);
        } catch {
          return {};
        }
      }
      return args;
    };

    const analyticsViewport = () =>
      window.matchMedia("(min-width: 768px)").matches ? "desktop" : "mobile";

    const trackDocsAgentEvent = (name, data = {}) => {
      try {
        window.__docsAgentTrackEvent?.(name, {
          surface: "docs_agent",
          route: window.location.pathname || "/",
          viewport: analyticsViewport(),
          ...data,
        });
      } catch {
        // Ignore analytics failures.
      }
    };

    const navigationTarget = (href, options) =>
      window.__getDocsAgentNavigationTarget(
        href,
        window.location.href,
        options
      );

    const navigateToHref = async (href, { externalNewTab = false } = {}) => {
      const target = navigationTarget(href);
      if (!target.ok) return target;
      const routeHref = target.href;

      if (
        routeHref.startsWith("/") &&
        typeof window.__docsAgentNavigate === "function"
      ) {
        docsAgentNavigationInProgress = true;
        try {
          await withTimeout(
            window.__docsAgentNavigate(routeHref, { history: "push" }),
            docsAgentNavigationTimeoutMs,
            "Docs agent navigation timed out"
          );
        } catch (error) {
          console.error("Docs agent navigation failed", error);
          return { ok: false, error: "Navigation failed or timed out." };
        } finally {
          docsAgentNavigationInProgress = false;
        }
      } else if (externalNewTab) {
        window.open(routeHref, "_blank", "noopener,noreferrer");
      } else {
        window.location.assign(routeHref);
      }

      return { ok: true, href: routeHref };
    };

    const navigationQueue =
      window.__createDocsAgentNavigationQueue(navigateToHref);

    const queueNavigationToHref = (href, options) => {
      const target = navigationTarget(href, options);
      if (!target.ok) return target;
      navigationQueue.queue(target.href);
      return target;
    };

    const chatKitTurnSettledCallbacks = new Set();

    const chatKitTurnIsActive = () =>
      chatkitResponseActive ||
      chatkitTurnActive ||
      navigationQueue.hasPending();

    const notifyChatKitTurnSettled = () => {
      if (chatKitTurnIsActive()) return;
      for (const callback of chatKitTurnSettledCallbacks) {
        callback();
      }
      chatKitTurnSettledCallbacks.clear();
    };

    const waitForChatKitTurnToSettle = (signal) => {
      if (signal.aborted) return Promise.resolve("aborted");
      if (!chatKitTurnIsActive()) return Promise.resolve("settled");

      return new Promise((resolve) => {
        let timeout;
        const finish = (result) => {
          window.clearTimeout(timeout);
          signal.removeEventListener("abort", onAbort);
          chatKitTurnSettledCallbacks.delete(onSettled);
          resolve(result);
        };
        const onAbort = () => finish("aborted");
        const onSettled = () => finish("settled");

        signal.addEventListener("abort", onAbort, { once: true });
        chatKitTurnSettledCallbacks.add(onSettled);
        timeout = window.setTimeout(
          () => finish("timed-out"),
          docsAgentTransitionWaitTimeoutMs
        );
      });
    };

    const deferPageTransitionDuringChatKitTurn = (event) => {
      if (docsAgentNavigationInProgress || !chatKitTurnIsActive()) return;
      const loadPage = event.loader;
      event.loader = async () => {
        const result = await waitForChatKitTurnToSettle(event.signal);
        if (result === "aborted" || event.signal.aborted) return;
        if (result === "timed-out") {
          // Asking Astro to cancel here makes it fall back to a full load. That
          // is safer than moving a ChatKit frame whose turn did not terminate.
          event.preventDefault();
          return;
        }
        await loadPage();
      };
    };

    const bindChatKitLifecycle = () => {
      if (chatkit.dataset.docsAgentLifecycleBound === "true") return;
      chatkit.dataset.docsAgentLifecycleBound = "true";
      chatkit.addEventListener("chatkit.thread.change", (event) => {
        const threadId = event?.detail?.threadId;
        if (threadId === null) {
          conversationStartedTracked = false;
        }
      });
      chatkit.addEventListener("chatkit.response.start", () => {
        chatkitResponseActive = true;
        navigationQueue.onResponseStart();
      });
      chatkit.addEventListener("chatkit.response.end", () => {
        chatkitResponseActive = false;
        void navigationQueue
          .onResponseEnd()
          .then(() => {
            if (!navigationQueue.hasPending()) {
              chatkitTurnActive = false;
              notifyChatKitTurnSettled();
            }
          })
          .catch((error) => {
            console.error("Docs agent navigation failed", error);
          });
      });
      chatkit.addEventListener("chatkit.error", () => {
        chatkitResponseActive = false;
        chatkitTurnActive = false;
        navigationQueue.clear();
        notifyChatKitTurnSettled();
      });
    };

    const buildChatKitOptions = () => ({
      api: {
        url: apiURL,
        domainKey,
        fetch: docsAgentFetch,
      },
      theme: {
        colorScheme: getColorTheme(),
      },
      header: { enabled: false },
      onClientTool(toolCall) {
        const args = normalizeClientToolArgs(
          toolCall?.params || toolCall?.arguments
        );

        if (toolCall?.name === "navigate_to_page") {
          return queueNavigationToHref(args.href, { internalOnly: true });
        }

        if (toolCall?.name === "open_custom_guide") {
          const guideHref =
            args.href ||
            (args.generated_id ? `/custom-guide/${args.generated_id}` : "");
          trackDocsAgentEvent("docs_agent_custom_guide_opened", {
            source: "client_tool",
            guide_id: args.generated_id || "",
            href: guideHref,
          });
          return queueNavigationToHref(guideHref);
        }

        return {
          ok: false,
          error: `Unknown client tool: ${toolCall?.name || "unknown"}.`,
        };
      },
      widgets: {
        onAction(action) {
          const payload = normalizeClientToolArgs(action?.payload);

          if (action?.type === "custom_guide.view") {
            const guideHref =
              payload.href ||
              payload.url ||
              (payload.generated_id
                ? `/custom-guide/${payload.generated_id}`
                : "");
            trackDocsAgentEvent("docs_agent_custom_guide_opened", {
              source: "widget_action",
              guide_id: payload.generated_id || "",
              href: guideHref,
            });

            return navigateToHref(guideHref);
          }

          if (action?.type === "docs_agent.navigate") {
            const href = payload.href || payload.url || "";
            trackDocsAgentEvent("docs_agent_suggested_page_opened", {
              source: "widget_action",
              href,
              suggestion_title: payload.title || "",
              suggestion_type: payload.type || "",
            });

            return navigateToHref(href, { externalNewTab: true });
          }

          return {
            ok: false,
            error: `Unknown widget action: ${action?.type || "unknown"}.`,
          };
        },
      },
      composer: {
        placeholder: "Ask about docs or what you want to build",
      },
      startScreen: {
        greeting: startGreeting,
        prompts: startPromptsForRoute(desiredPathname),
      },
    });

    const applyChatKitOptions = () => {
      chatkit.setOptions(buildChatKitOptions());
    };

    // Existing ChatKit instances keep the options they were created with.
    // Route changes only select the prompts for the next explicit new thread.
    const syncDesiredPathnameForPageLoad = () => {
      desiredPathname = window.location.pathname || "/";
    };

    const syncDesiredPathnameBeforeSwap = (event) => {
      const destination = event?.to;
      if (destination instanceof URL) {
        desiredPathname = destination.pathname || "/";
      } else if (typeof destination === "string") {
        desiredPathname = new URL(destination, window.location.href).pathname;
      }
    };

    const initializeChatKit = async () => {
      if (chatkitInitialized) return;
      showStatus("Loading docs agent...");

      try {
        await withTimeout(
          customElements.whenDefined("openai-chatkit"),
          docsAgentInitializationTimeoutMs,
          "Docs agent initialization timed out"
        );

        bindChatKitLifecycle();
        applyChatKitOptions();
        chatkitInitialized = true;
        hideStatus();
      } catch (error) {
        console.error("Failed to initialize Docs Agent ChatKit", error);
        showStatus("Docs agent is unavailable.");
      }
    };

    const resetChatKit = () => {
      if (chatkitReplacement) return chatkitReplacement;
      navigationQueue.clear();

      chatkitReplacement = (async () => {
        const nextChatKit = document.createElement("openai-chatkit");
        nextChatKit.id = "docs-agent-chatkit";
        nextChatKit.className = "block h-full w-full";
        chatkit.replaceWith(nextChatKit);
        chatkit = nextChatKit;
        chatkitInitialized = false;
        chatkitResponseActive = false;
        chatkitTurnActive = false;
        conversationStartedTracked = false;
        resetDocsAgentSessionId();
        await initializeChatKit();
        notifyChatKitTurnSettled();
      })();

      void chatkitReplacement.then(
        () => {
          chatkitReplacement = null;
        },
        () => {
          chatkitReplacement = null;
        }
      );
      return chatkitReplacement;
    };

    const openPanel = () => {
      if (root.dataset.open !== "true") {
        trackDocsAgentEvent("docs_agent_panel_opened", {
          source: "ask_button",
          has_page_selection: hasPageSelectionForAnalytics(),
        });
      }
      previousFocus = document.activeElement;
      document.body.dataset.docsAgentOpen = "true";
      document.body.classList.add("docs-agent-open");
      root.dataset.open = "true";
      root.classList.add("is-open");
      syncLayoutTargets();
      initializeChatKit();
      requestAnimationFrame(() => closeButton.focus());
    };

    const closePanel = () => {
      delete document.body.dataset.docsAgentOpen;
      document.body.classList.remove("docs-agent-open");
      delete root.dataset.open;
      root.classList.remove("is-open");
      syncLayoutTargets();
      if (previousFocus instanceof HTMLElement) {
        previousFocus.focus();
      }
    };

    clearLegacyStoredState();
    desktopPanelMedia.addEventListener("change", syncLayoutTargets);
    document.addEventListener("selectionchange", rememberPageSelection);
    document.addEventListener(
      "astro:before-preparation",
      deferPageTransitionDuringChatKitTurn
    );
    document.addEventListener(
      "astro:before-swap",
      syncDesiredPathnameBeforeSwap
    );
    document.addEventListener("astro:page-load", syncLayoutTargets);
    document.addEventListener(
      "astro:page-load",
      syncDesiredPathnameForPageLoad
    );
    document.addEventListener("pointerdown", (event) => {
      if (
        event.target instanceof Element &&
        event.target.closest("button[data-docs-agent-open]")
      ) {
        rememberPageSelection();
      }
    });
    document.addEventListener("click", (event) => {
      if (
        event.target instanceof Element &&
        event.target.closest("button[data-docs-agent-open]")
      ) {
        openPanel();
      }
    });
    newButton.addEventListener("click", resetChatKit);
    closeButton.addEventListener("click", closePanel);
    window.addEventListener("docs-agent:close", closePanel);
    panel.addEventListener("keydown", (event) => {
      if (event.key === "Escape") {
        closePanel();
      }
    });

    root.dataset.initialized = "true";
    syncLayoutTargets();
  }

  document.addEventListener("astro:page-load", initializeDocsAgentLauncher);
  window.addEventListener(
    "docs-agent:helpers-ready",
    initializeDocsAgentLauncher
  );
  initializeDocsAgentLauncher();
</script> <script type="module" src="/_astro/PageLayout.astro_astro_type_script_index_0_lang.B7KQI6v3.js"></script> </body> </html>