1<!doctype html> 2<html lang="en"> 3<head> 4 <meta charset="utf-8" /> 5 <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" /> 6 <title>Intuitize</title> 7 <link rel="icon" href="/logo.svg" type="image/svg+xml" /> 8
8<script> 9 window.coi = { coepCredentialless: () => false, quiet: true }; 10 </script>
10 11
11<script src="coi-serviceworker.js"></script>
11 12 <link rel="preload" href="styles.css" as="style"> 13 <link rel="stylesheet" href="styles.css" /> 14
14<script type="importmap"> 15 { 16 "imports": { 17 "markdown-it": "https://esm.sh/[email protected]?bundle", 18 "highlight.js": "https://esm.sh/[email protected]?bundle", 19 "dompurify": "https://esm.sh/[email protected]?bundle" 20 } 21 } 22 </script>
22 23</head> 24<body> 25
25<script> 26 // Read ?ismobile=true|false and apply a mobile class to the document body. 27 (function(){ 28 try { 29 const p = new URLSearchParams(location.search); 30 const isMobile = p.get('ismobile'); 31 if (isMobile === 'true') { 32 document.documentElement.classList.add('mobile-mode'); 33 document.body?.classList.add('mobile-mode'); 34 } else if (isMobile === 'false') { 35 document.documentElement.classList.remove('mobile-mode'); 36 document.body?.classList.remove('mobile-mode'); 37 } 38 // expose a small helper on window for debugging/toggling in dev 39 window.__ismobile = isMobile === 'true'; 40 } catch (e) { /* ignore */ } 41 })(); 42 </script>
42 43 44 <!-- Persistent product navigation: sidebar on desktop, top bar on mobile --> 45 <aside id="top-controls" aria-hidden="false"> 46 <div class="brand" aria-label="Intuitize">Intuitize</div> 47 <div id="top-controls-right" aria-hidden="false"> 48 <button id="history-btn" class="icon-btn" aria-label="Open chat history" data-tooltip="History"> 49 <img src="/history.svg" alt="" draggable="false" /> 50 <span class="nav-label">History</span> 51 </button> 52 <button id="account-btn" class="icon-btn" aria-label="Open accounts" data-tooltip="Accounts"> 53 <img src="/account.svg" alt="" draggable="false" /> 54 <span class="nav-label">Accounts</span> 55 </button> 56 <button id="incognito-btn" class="icon-btn" aria-label="Toggle incognito mode" data-tooltip="Incognito"> 57 <img src="/incognitomode.svg" alt="" draggable="false" /> 58 <span class="nav-label">Incognito</span> 59 </button> 60 <button id="settings-btn" class="icon-btn" aria-label="Open settings" data-tooltip="Settings"> 61 <img src="/settings.svg" alt="" draggable="false" /> 62 <span class="nav-label">Settings</span> 63 </button> 64 </div> 65 </aside> 66 67 <!-- Mobile floating chat button (bottom corner) --> 68 <button id="chat-fab" class="icon-btn chat-fab" aria-label="Open chat"> 69 <svg viewBox="0 0 20 20" aria-hidden="true"> 70 <path d="M3.5 5h13a1.5 1.5 0 0 1 1.5 1.5v7a1.5 1.5 0 0 1-1.5 1.5H9l-4 3.5V15H3.5A1.5 1.5 0 0 1 2 13.5v-7A1.5 1.5 0 0 1 3.5 5z" /> 71 </svg> 72 </button> 73 74 <!-- Incognito top banner (transient) --> 75 <div id="incognito-banner" aria-live="polite" aria-atomic="true" hidden> 76 <div id="incognito-banner-inner">Incognito mode</div> 77 </div> 78 79 80 81 <main id="app"> 82 <div id="main-model-picker"> 83 <label for="model-select">Model</label> 84 <select id="model-select" aria-label="Choose model"> 85 <option value="intuitize-9">Intuitize 9</option> 86 <option value="intuitize-6">Intuitize 6</option> 87 <option value="intuitize-6-pro">Intuitize 6 Pro</option> 88 </select> 89 </div> 90 <div class="hero-copy"> 91 <h1 id="visit-prompt">Bring me a project. Let's make it better.</h1> 92 </div> 93 <div id="attachments" class="attachments" hidden></div> 94 <form id="composer" autocomplete="off" novalidate> 95 <button type="button" class="attach-btn" id="attach-btn" aria-label="Attach image"> 96 <svg viewBox="0 0 20 20" aria-hidden="true"> 97 <line x1="10" y1="4.5" x2="10" y2="15.5" /> 98 <line x1="4.5" y1="10" x2="15.5" y2="10" /> 99 </svg> 100 </button> 101 <input type="file" id="file-input" accept="image/*" multiple hidden aria-hidden="true" /> 102 <textarea id="input" name="message" rows="1" placeholder="Ask Intuitizeâ¦" inputmode="text" aria-label="Ask Intuitize" title="Enter to send · Shift+Enter for a new line"></textarea> 103 <button class="send-btn" type="submit" aria-label="Send message"> 104 <svg viewBox="0 0 20 20" aria-hidden="true"><path d="M10 15V5m0 0L6 9m4-4 4 4"/></svg> 105 </button> 106 </form> 107 108 <!-- Generation status (fades/rotates while AI is streaming) --> 109 <div id="gen-status" aria-hidden="true" hidden></div> 110 111 112 113 <!-- Pending indicator shown when requests are being retried after rate limits --> 114 <div id="pending" aria-live="polite" aria-atomic="true" hidden style="margin-top:8px;color:var(--muted);font-size:14px;text-align:center;"> 115 Pending... 116 </div> 117 </main> 118 119 <a class="eco-mission" href="blog/index.html" aria-label="Read our blog"> 120 <span>Blog</span> 121 <p>Notes on how we build Intuitizeâdesign, engineering, and the thinking behind each release.</p> 122 <i aria-hidden="true">â</i> 123 </a> 124 125 <aside id="intuitize9-banner" class="release-banner" aria-label="Intuitize 9 announcement"> 126 <div class="release-banner-copy"> 127 <strong>Introducing Intuitize 9</strong> 128 <span>Deep reasoning and serious code generation, now free.</span> 129 </div> 130 <div class="release-banner-actions"> 131 <a href="blog/products/introducing-intuitize-9.html">Read</a> 132 <button id="dismiss-intuitize9-banner" type="button">Exit</button> 133 </div> 134 </aside> 135 136 <!-- Fullscreen overlay moved to root so it covers the entire viewport --> 137 <div id="overlay" aria-hidden="true"> 138 <div id="overlay-panel" role="dialog" aria-modal="true"> 139 <div id="overlay-header"> 140 <div id="model-badge">Intuitize 9</div> 141 <button id="close-overlay" aria-label="Close response">Close</button> 142 </div>
143 <div id="overlay-content" tabindex="0" aria-live="polite"> 144 <div id="messages" class="messages" role="log" aria-live="polite"></div> 145 146 147 </div> 148 <div id="overlay-footer"> 149 <div id="overlay-attachments" class="attachments" hidden></div> 150 <form id="overlay-composer" autocomplete="off" novalidate> 151 <button type="button" class="attach-btn" id="overlay-attach-btn" aria-label="Attach image"> 152 <svg viewBox="0 0 20 20" aria-hidden="true"> 153 <line x1="10" y1="4.5" x2="10" y2="15.5" /> 154 <line x1="4.5" y1="10" x2="15.5" y2="10" /> 155 </svg> 156 </button> 157 <input type="file" id="overlay-file-input" accept="image/*" multiple hidden aria-hidden="true" /> 158 <textarea id="overlay-input" name="message" rows="1" placeholder="Ask againâ¦" inputmode="text" aria-label="Ask Intuitize" title="Enter to send · Shift+Enter for a new line"></textarea> 159 <button class="send-btn" type="submit" aria-label="Send message"> 160 <svg viewBox="0 0 20 20" aria-hidden="true"><path d="M10 15V5m0 0L6 9m4-4 4 4"/></svg> 161 </button> 162 </form> 163 164 <!-- Small disclaimer shown under the overlay chat input (centered) --> 165 <div id="overlay-disclaimer" role="status" aria-live="polite" style="margin-top:8px;color:var(--muted);font-size:13px;text-align:center;pointer-events:none;"> 166 Intuitize can make mistakes. 167 </div> 168 </div> 169 </div> 170 </div> 171 172 <!-- History modal (separate from main overlay) --> 173 <div id="history-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="history-title" aria-describedby="history-summary"> 174 <div id="history-panel"> 175 <div id="history-header"> 176 <div class="history-heading"> 177 <h2 id="history-title">History</h2> 178 <p id="history-summary">Your remembered conversations</p> 179 </div> 180 <button id="close-history" aria-label="Close history">Close</button> 181 </div> 182 <div id="history-content" tabindex="0" aria-live="polite"> 183 <!-- persisted messages will be rendered here --> 184 </div> 185 <div id="history-footer"> 186 <span id="history-storage-note">Private on this device</span> 187 <button id="history-clear" aria-label="Clear all chat history">Clear all</button> 188 </div> 189 </div> 190 </div> 191 192 <!-- Sources modal, available only for answers backed by an Exa lookup --> 193 <div id="sources-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="sources-title" aria-describedby="sources-summary"> 194 <div id="sources-panel"> 195 <div id="sources-header"> 196 <div class="sources-heading"> 197 <h2 id="sources-title">Sources</h2> 198 <p id="sources-summary">Web references used for this answer</p> 199 </div> 200 <button id="close-sources" aria-label="Close sources">Close</button> 201 </div> 202 <div id="sources-content" tabindex="0"></div> 203 </div> 204 </div> 205 206 <!-- Personalization settings --> 207 <div id="personalize-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="personalize-title" aria-describedby="personalize-summary"> 208 <div id="personalize-panel"> 209 <div id="personalize-header"> 210 <div class="personalize-heading"> 211 <h2 id="personalize-title">Personalize</h2> 212 <p id="personalize-summary">Shape how Intuitize responds to you</p> 213 </div> 214 <button id="close-personalize" aria-label="Close personalization">Close</button> 215 </div> 216 <form id="personalize-form"> 217 <label class="personalize-field" for="personalize-name"> 218 <span>Your name</span> 219 <input id="personalize-name" name="name" type="text" maxlength="60" autocomplete="name" placeholder="What should Intuitize call you?" /> 220 </label> 221 <label class="personalize-field" for="personalize-personality"> 222 <span>AI personality</span> 223 <select id="personalize-personality" name="personality"> 224 <option value="happy">Happy</option> 225 <option value="curious">Curious</option> 226 <option value="professional">Professional</option> 227 <option value="formal">
227Formal</option> 228 </select> 229 </label> 230 <fieldset class="personalize-interests"> 231 <legend>Things you're into</legend> 232 <p>These can shape replies. Intuitize also keeps this list current as you chat.</p> 233 <div class="interest-options"> 234 <label><input type="checkbox" name="interests" value="Coding" /><span>Coding</span></label> 235 <label><input type="checkbox" name="interests" value="Art" /><span>Art</span></label> 236 <label><input type="checkbox" name="interests" value="Computers" /><span>Computers</span></label> 237 </div> 238 <label class="personalize-field" for="personalize-other"> 239 <span>Other</span> 240 <input id="personalize-other" name="other" type="text" maxlength="120" placeholder="Music, hiking, astronomy..." /> 241 </label> 242 </fieldset> 243 <div id="personalize-footer"> 244 <span>Private on this device</span> 245 <button type="submit">Save</button> 246 </div> 247 </form> 248 </div> 249 </div> 250 251 <!-- User-defined skills, selected automatically from the latest chat turn --> 252 <div id="skills-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="skills-title" aria-describedby="skills-summary"> 253 <div id="skills-panel"> 254 <div id="skills-header"> 255 <div class="skills-heading"> 256 <h2 id="skills-title">Skills</h2> 257 <p id="skills-summary">Read only when a chat matches</p> 258 </div> 259 <button id="close-skills" type="button" aria-label="Close skills">Close</button> 260 </div> 261 <form id="skills-form"> 262 <div id="skills-list"></div> 263 <button id="add-skill" type="button">Add skill</button> 264 <div id="skills-footer"> 265 <span>Private on this device</span> 266 <button type="submit">Save</button> 267 </div> 268 </form> 269 </div> 270 </div> 271 272 <div id="account-modal" class="account-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="account-title"> 273 <div id="account-gate-backdrop"></div> 274 <div class="account-panel account-panel-gate"> 275 <button id="close-account" class="account-close" type="button" aria-label="Close account">Close</button> 276 <p class="welcome-eyebrow account-eyebrow">Your account</p>
277 <div id="account-profile-picture" class="account-profile-picture" hidden> 278 <img id="account-avatar" class="account-avatar" alt="" /> 279 <button id="account-avatar-upload" class="account-avatar-upload" type="button">Change picture</button> 280 <input id="account-avatar-input" type="file" accept="image/*" hidden /> 281 <span id="account-avatar-status" class="account-avatar-status" role="status" aria-live="polite"></span> 282 </div> 283 <h2 id="account-title" class="account-title-text">Intuitize is better with an account.</h2> 284 <p class="account-copy account-copy-text">Keep your experience connected across devices. Accounts are coming soon.</p> 285 <div class="account-actions"> 286 <button id="account-signup" class="welcome-primary" type="button">Sign up</button> 287 <button id="account-signin" class="account-secondary account-secondary-gate" type="button">Sign in</button> 288 <button id="account-signout" class="account-secondary account-secondary-gate" type="button" hidden>Sign out</button> 289 </div> 290 </div> 291 </div> 292 293 <div id="auth-modal" class="account-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="auth-title"> 294 <div id="auth-gate-backdrop"></div> 295 <div class="account-panel auth-panel"> 296 <button id="close-auth" class="account-close" type="button" aria-label="Close account dialog">Close</button> 297 <p class="welcome-eyebrow auth-eyebrow">Continue securely</p> 298 <h2 id="auth-title" class="auth-title-text">Sign up</h2> 299 <p class="account-copy auth-copy">Intuitize is better with an account. Use Google to continue.</p> 300 <button id="auth-google" class="welcome-primary auth-google" type="button">Continue with Google</button> 301 <label class="gate-age-check auth-age-check"> 302 <input type="checkbox" id="auth-age-check" /> 303 <span>I confirm I am 13 or older, or have permission to use this service</span> 304 </label> 305 <button id="auth-back" class="account-secondary auth-back-btn" type="button">Back</button> 306 </div> 307 </div> 308 309 <!-- First-run privacy notice and onboarding --> 310 <div id="welcome-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="welcome-title"> 311 <div id="welcome-panel"> 312 <section id="privacy-step" class="welcome-step"> 313 <div class="privacy-mark" aria-hidden="true">P</div> 314 <p class="welcome-eyebrow">A quiet note before we start</p> 315 <h2 id="welcome-title">Psst.. all your chats are private</h2> 316 <p>Your history and personalization are saved locally on this device, not in an Intuitize account. Messages are sent to the AI service to generate replies; the local copy stays available for helpful memory, and you can clear it whenever you want.</p> 317 <button id="privacy-continue" class="welcome-primary" type="button">Continue</button> 318 </section> 319 <section id="onboarding-step" class="welcome-step" hidden> 320 <p class="welcome-eyebrow">Personalization</p> 321 <h2 id="onboarding-title">What's your name?</h2> 322 <p>Your friend wants to know you a bit!</p> 323 <form id="onboarding-form"> 324 <label class="welcome-name" for="onboarding-name"> 325 <span>Name</span> 326 <input id="onboarding-name" name="name" type="text" maxlength="60" autocomplete="name" placeholder="What should I call you?" required /> 327 </label> 328 <label class="welcome-name" for="onboarding-gender"> 329 <span>What's your gender? <small>(optional)</small></span> 330 <select id="onboarding-gender" name="gender"> 331 <option value="">Prefer not to say</option> 332 <option value="woman">Woman</option> 333 <option value="man">Man</option> 334 <option value="non-binary">Non-binary</option> 335 <option value="another identity">Another identity</option> 336 </select> 337 </label> 338 <fieldset class="onboarding-interests"> 339 <legend>What are you into?</legend> 340 <div class="interest-options interest-options-large"> 341 <label><input type="checkbox" name="interests" value="Coding" /><span>Coding</span></label> 342 <label><input type="checkbox" name="interests" value="Art" /><span>Art</span></label> 343 <label><input type="checkbox" name="interests" value="Computers" /><span>Computers</span></label> 344 <label><input id="onboarding-other-toggle" type="checkbox" value="Other" /><span>
344Other</span></label> 345 </div> 346 <input id="onboarding-other" type="text" maxlength="120" placeholder="Tell us what else" hidden /> 347 </fieldset> 348 <p class="welcome-local-note">Saved only on this device. Your interests can evolve automatically as you chat.</p> 349 <div class="welcome-actions"> 350 <button id="onboarding-skip" type="button">Skip</button> 351 <button class="welcome-primary" type="submit">Start chatting</button> 352 </div> 353 </form> 354 </section> 355 </div> 356 </div> 357 358 <div id="policy-update-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="policy-update-title"> 359 <div id="policy-update-panel"> 360 <p class="welcome-eyebrow">A quick update</p> 361 <h2 id="policy-update-title">We updated our privacy policy and terms of service!</h2> 362 <p>Please review the latest versions when you have a moment.</p> 363 <div class="policy-update-links"><a href="policy/privacy-policy.html">Privacy Policy</a><a href="policy/terms-of-service.html">Terms of Service</a></div> 364 <button id="policy-update-close" class="welcome-primary" type="button">Continue</button> 365 </div> 366 </div> 367 368 <!-- Login gate popup (shown to unsigned-in users in the US) --> 369 <div id="login-gate" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="login-gate-title"> 370 <div id="login-gate-backdrop"></div> 371 <div id="login-gate-panel"> 372 <h2 id="login-gate-title">Log in to get more than 5 messages.</h2> 373 <label class="gate-age-check"> 374 <input type="checkbox" id="login-gate-age-check" /> 375 <span>I confirm I am 13 or older, or have permission to use this service</span> 376 </label> 377 <div class="login-gate-actions"> 378 <button id="login-gate-signin" class="welcome-primary" type="button">Sign in</button> 379 <button id="login-gate-close" class="account-secondary" type="button">Not now</button> 380 </div> 381 </div> 382 </div> 383 384 <!-- Pro gate popup (shown when unsigned-in US users try to pick Pro) --> 385 <div id="pro-gate" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="pro-gate-title"> 386 <div id="pro-gate-backdrop"></div> 387 <div id="pro-gate-panel"> 388 <h2 id="pro-gate-title">Log in to access a stronger model.</h2> 389 <label class="gate-age-check"> 390 <input type="checkbox" id="pro-gate-age-check" /> 391 <span>I confirm I am 13 or older, or have permission to use this service</span> 392 </label> 393 <div class="pro-gate-actions"> 394 <button id="pro-gate-signin" class="welcome-primary" type="button">Sign in</button> 395 <button id="pro-gate-close" class="account-secondary" type="button">Not now</button> 396 </div> 397 </div> 398 </div> 399 400 <!-- Login blocked popup (non-district, under-13, no permission) --> 401 <div id="blocked-gate" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="blocked-gate-title"> 402 <div id="blocked-gate-backdrop"></div> 403 <div id="blocked-gate-panel"> 404 <h2 id="blocked-gate-title">Login blocked.</h2> 405 <p class="blocked-gate-copy">You must be 13 or older to use this service. Users under 13 may use it only if their organization permits it.</p> 406 <div class="blocked-gate-actions"> 407 <button id="blocked-gate-close" class="account-secondary" type="button">Close</button> 408 </div> 409 </div> 410 </div> 411 412
412<script type="module" src="app.js" defer></script>
412 413</body> 414</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.