diff --git a/docs/design/artboards/d215/index.html b/docs/design/artboards/d215/index.html
index f60136c6b..c15e207cf 100644
--- a/docs/design/artboards/d215/index.html
+++ b/docs/design/artboards/d215/index.html
@@ -424,6 +424,29 @@
 .app.m .composer { margin: 4px 10px 10px; }
 .app.m .cgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
 .app.m .tile { height: 104px; }
+/* auth pages (sign-in, sign-up, forgot, reset, verify): one card on the grey canvas; edge to edge at 390 */
+.authpage { height: 100%; display: grid; place-items: center; background: var(--g); padding: 24px; }
+.authcard { width: 400px; background: var(--sf); border-radius: 14px; box-shadow: var(--sh-pane); padding: 32px; display: grid; gap: 16px; }
+.authcard .brand { display: flex; align-items: center; gap: 10px; font: 800 18px/1 var(--f-display); letter-spacing: -0.03em; }
+.authcard .brand .logo { width: 30px; height: 30px; border-radius: 9px; }
+.authcard .brand .logo svg.i { width: 17px; height: 17px; }
+.authcard h1 { font: 800 28px/1.1 var(--f-display); letter-spacing: -0.03em; margin: 4px 0 0; }
+.authcard .b { width: 100%; height: 40px; border-radius: 10px; font-size: 14px; }
+.authcard .b svg.lgi { width: 18px; height: 18px; flex: none; }
+.authcard .or { display: flex; align-items: center; gap: 12px; font: 500 11.5px/1 var(--f-mono); color: var(--mu); }
+.authcard .or::before, .authcard .or::after { content: ""; flex: 1; height: 1px; background: var(--d); }
+.authcard .fl { display: grid; gap: 6px; }
+.authcard .fl .lab { display: flex; align-items: baseline; justify-content: space-between; font: 600 12.5px/1 var(--f-body); color: var(--ink2); }
+.authcard .fl .lab a { font-weight: 500; color: var(--c-text); }
+.authcard .field { height: 40px; border-radius: 10px; font-size: 14px; }
+.authcard .field.bad { box-shadow: inset 0 0 0 1.5px var(--ink); }
+.authcard .alrt { display: flex; gap: 10px; align-items: flex-start; padding: 11px 12px; border-radius: 10px; background: var(--t); box-shadow: inset 0 0 0 1px var(--b); font-size: 13px; line-height: 19px; color: var(--ink); }
+.authcard .alrt svg.i { width: 16px; height: 16px; margin-top: 1.5px; }
+.authcard .alt { text-align: center; font-size: 13.5px; color: var(--se); }
+.authcard a { text-decoration: none; }
+.authcard .alt a { color: var(--c-text); font-weight: 600; }
+.app.m .authpage { background: var(--sf); place-items: start stretch; padding: 0; }
+.app.m .authcard { width: auto; box-shadow: none; border-radius: 0; padding: 28px 20px; }
 </style>
 
 <svg width="0" height="0" style="position:absolute" aria-hidden="true">
@@ -488,6 +511,7 @@
     <!-- brand marks, simplified for the mock -->
     <symbol id="lg-slack" viewBox="0 0 40 40"><rect x="17" y="4" width="6" height="15" rx="3" fill="#36C5F0"/><rect x="21" y="17" width="15" height="6" rx="3" fill="#2EB67D"/><rect x="17" y="21" width="6" height="15" rx="3" fill="#ECB22E"/><rect x="4" y="17" width="15" height="6" rx="3" fill="#E01E5A"/></symbol>
     <symbol id="lg-telegram" viewBox="0 0 40 40"><circle cx="20" cy="20" r="17" fill="#2AABEE"/><path d="M10.5 19.6 27.8 12.8c.8-.3 1.5.2 1.3 1.4l-2.9 13.8c-.2 1-.8 1.2-1.6.8l-4.4-3.3-2.1 2c-.2.2-.4.4-.9.4l.3-4.5 8.2-7.4c.4-.3-.1-.5-.5-.2l-10.1 6.4-4.4-1.4c-1-.3-1-1 .2-1.4z" fill="#fff"/></symbol>
+    <symbol id="lg-google" viewBox="0 0 18 18"><path fill="#4285F4" d="M17.64 9.2c0-.64-.06-1.25-.16-1.84H9v3.48h4.84a4.14 4.14 0 0 1-1.8 2.72v2.26h2.92c1.7-1.57 2.68-3.88 2.68-6.62Z"/><path fill="#34A853" d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.92-2.26c-.8.54-1.84.86-3.04.86-2.34 0-4.32-1.58-5.03-3.7H.96v2.33A9 9 0 0 0 9 18Z"/><path fill="#FBBC05" d="M3.97 10.72a5.41 5.41 0 0 1 0-3.44V4.95H.96a9 9 0 0 0 0 8.1l3.01-2.33Z"/><path fill="#EA4335" d="M9 3.58c1.32 0 2.5.45 3.44 1.35l2.58-2.58C13.46.9 11.42 0 9 0A9 9 0 0 0 .96 4.95l3.01 2.33C4.68 5.16 6.66 3.58 9 3.58Z"/></symbol>
     <symbol id="lg-github" viewBox="0 0 40 40"><circle cx="20" cy="20" r="17" fill="var(--ink)"/><path d="M20 10.5c-5.2 0-9.4 4.2-9.4 9.4 0 4.2 2.7 7.7 6.4 8.9.5.1.6-.2.6-.5v-1.7c-2.6.6-3.2-1.2-3.2-1.2-.4-1.1-1-1.4-1-1.4-.9-.6.1-.6.1-.6.9.1 1.4 1 1.4 1 .8 1.4 2.2 1 2.7.8.1-.6.3-1 .6-1.2-2.1-.2-4.3-1-4.3-4.6 0-1 .4-1.9 1-2.5-.1-.2-.4-1.2.1-2.5 0 0 .8-.3 2.6 1a9 9 0 0 1 4.7 0c1.8-1.3 2.6-1 2.6-1 .5 1.3.2 2.3.1 2.5.6.7 1 1.5 1 2.5 0 3.6-2.2 4.4-4.3 4.6.3.3.6.9.6 1.7v2.6c0 .3.2.6.7.5a9.4 9.4 0 0 0-3-18.3z" fill="var(--sf)"/></symbol>
     <symbol id="lg-linear" viewBox="0 0 40 40"><circle cx="20" cy="20" r="16" fill="#5E6AD2"/><path d="M8 22.5 17.5 32M7.4 18 22 32.6M9 13.5 26.5 31M12.2 10 30 27.8M16.5 8 32 23.5" stroke="#fff" stroke-width="1.6" opacity=".9"/></symbol>
     <symbol id="lg-atlassian" viewBox="0 0 40 40"><path d="M13.2 19.4c-.4-.5-1.1-.4-1.4.2L5.3 32.5c-.3.6.1 1.3.8 1.3h9.1c.3 0 .6-.2.8-.5 2-4.1.8-10.3-2.8-13.9z" fill="#2684FF"/><path d="M18 7.6c-3.5 5.6-3.3 11.7-1 16.4l4.4 8.9c.2.3.5.5.8.5h9.1c.7 0 1.1-.7.8-1.3L19.4 7.6c-.3-.6-1.1-.6-1.4 0z" fill="#0052CC"/></symbol>
@@ -536,7 +560,7 @@ <h1>Same look. <em>Less said.</em></h1>
   <li><svg viewBox="0 0 24 24"><use href="#i-grid"/></svg><b>One screen first</b><span>Repeated blocks become a table; rare settings collapse.</span></li>
 </ol>
 <nav class="toc" aria-label="Surfaces">
-  <a href="#s-sidebar">Sidebar controls</a><a href="#s-chat">Pod chat</a><a href="#s-board">Task board</a><a href="#s-memory">Memory</a><a href="#s-agent">Agent settings</a><a href="#s-settings">Settings</a><a href="#s-connectors">Connectors</a><a href="#s-dark">Dark mode</a>
+  <a href="#s-sidebar">Sidebar controls</a><a href="#s-chat">Pod chat</a><a href="#s-board">Task board</a><a href="#s-memory">Memory</a><a href="#s-agent">Agent settings</a><a href="#s-settings">Settings</a><a href="#s-connectors">Connectors</a><a href="#s-signin">Sign in</a><a href="#s-dark">Dark mode</a>
 </nav>
 
 <section class="surf" id="s-sidebar">
@@ -756,6 +780,13 @@ <h1>Same look. <em>Less said.</em></h1>
   </div>
 </section>
 
+<section class="surf" id="s-signin">
+  <div class="shead"><h2>Sign in</h2><span class="route">/login + /v2/login, one component</span><div class="nums"><span class="num">components <b>2</b> → <i>1</i></span><span class="num">subtitle <b>1 line</b> → <i>none</i></span></div></div>
+  <div class="row1"><figure><figcaption><b>Sign in · 1440</b><span>email and password; providers above</span></figcaption><div class="frame" style="--fw:1440;--fh:900" data-surface="signin" data-vp="1440" data-state="default"><div class="app d"><div class="authpage"><div class="authcard"><div class="brand"><span class="logo"><svg class="i" viewBox="0 0 24 24"><use href="#i-mark"/></svg></span>commonly</div><h1>Sign in</h1><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 40 40"><use href="#lg-github"/></svg>Continue with GitHub</button><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 18 18"><use href="#lg-google"/></svg>Continue with Google</button><div class="or">or</div><div class="fl"><div class="lab">Email</div><div class="field"><span>alex@studio.dev</span></div></div><div class="fl"><div class="lab">Password<a href="#">Forgot password?</a></div><div class="field"><span class="mu">••••••••••</span></div></div><button class="b b-p" type="button">Sign in</button><div class="alt">New to Commonly? <a href="#">Create an account</a></div></div></div></div></div></figure></div>
+  <div class="row2"><figure><figcaption><b>Sign in · 390</b><span>edge to edge, no card chrome</span></figcaption><div class="frame" style="--fw:390;--fh:844" data-surface="signin" data-vp="390" data-state="default"><div class="app m"><div class="authpage"><div class="authcard"><div class="brand"><span class="logo"><svg class="i" viewBox="0 0 24 24"><use href="#i-mark"/></svg></span>commonly</div><h1>Sign in</h1><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 40 40"><use href="#lg-github"/></svg>Continue with GitHub</button><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 18 18"><use href="#lg-google"/></svg>Continue with Google</button><div class="or">or</div><div class="fl"><div class="lab">Email</div><div class="field"><span>alex@studio.dev</span></div></div><div class="fl"><div class="lab">Password<a href="#">Forgot password?</a></div><div class="field"><span class="mu">••••••••••</span></div></div><button class="b b-p" type="button">Sign in</button><div class="alt">New to Commonly? <a href="#">Create an account</a></div></div></div></div></div></figure><figure><figcaption><b>Wrong password · 390</b><span></span></figcaption><div class="frame" style="--fw:390;--fh:844" data-surface="signin" data-vp="390" data-state="error"><div class="app m"><div class="authpage"><div class="authcard"><div class="brand"><span class="logo"><svg class="i" viewBox="0 0 24 24"><use href="#i-mark"/></svg></span>commonly</div><h1>Sign in</h1><div class="alrt" role="alert"><svg class="i" viewBox="0 0 24 24"><use href="#i-alert"/></svg><span>Login failed</span></div><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 40 40"><use href="#lg-github"/></svg>Continue with GitHub</button><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 18 18"><use href="#lg-google"/></svg>Continue with Google</button><div class="or">or</div><div class="fl"><div class="lab">Email</div><div class="field bad"><span>alex@studio.dev</span></div></div><div class="fl"><div class="lab">Password<a href="#">Forgot password?</a></div><div class="field bad"><span class="mu">••••••••••</span></div></div><button class="b b-p" type="button">Sign in</button><div class="alt">New to Commonly? <a href="#">Create an account</a></div></div></div></div></div></figure><div class="notes"><ul><li><b>One page replaces both.</b> /login and /v2/login are two components today; this is the single frame to lift, on the product's tokens.</li><li><b>Social first, then the form.</b> The two provider keys sit above an "or"; the form has two fields and one filled key. The tagline under the title is gone; the page is its own label.</li><li><b>Forgot password lives on the password label,</b> where the eye is when it is needed, not as a line under the button.</li><li><b>Errors are one row above the form.</b> Wrong password shows the server's line; an invite-only OAuth bounce shows its longer line (right). Both fields get an ink ring while the alert is up.</li><li>Dark follows the system, as everywhere.</li></ul></div></div>
+  <div class="row2" style="margin-top:18px"><figure><figcaption><b>Invite-only bounce · 1440</b><span>from an OAuth sign-up that needs an invitation</span></figcaption><div class="frame" style="--fw:1440;--fh:900" data-surface="signin" data-vp="1440" data-state="error"><div class="app d"><div class="authpage"><div class="authcard"><div class="brand"><span class="logo"><svg class="i" viewBox="0 0 24 24"><use href="#i-mark"/></svg></span>commonly</div><h1>Sign in</h1><div class="alrt" role="alert"><svg class="i" viewBox="0 0 24 24"><use href="#i-alert"/></svg><span>Registration is invite-only right now. Use an invitation link to sign up, or join the waitlist.</span></div><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 40 40"><use href="#lg-github"/></svg>Continue with GitHub</button><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 18 18"><use href="#lg-google"/></svg>Continue with Google</button><div class="or">or</div><div class="fl"><div class="lab">Email</div><div class="field"><span>alex@studio.dev</span></div></div><div class="fl"><div class="lab">Password<a href="#">Forgot password?</a></div><div class="field"><span class="mu">••••••••••</span></div></div><button class="b b-p" type="button">Sign in</button><div class="alt">New to Commonly? <a href="#">Create an account</a></div></div></div></div></div></figure><figure><figcaption><b>Invite-only bounce · 390</b><span></span></figcaption><div class="frame" style="--fw:390;--fh:844" data-surface="signin" data-vp="390" data-state="error"><div class="app m"><div class="authpage"><div class="authcard"><div class="brand"><span class="logo"><svg class="i" viewBox="0 0 24 24"><use href="#i-mark"/></svg></span>commonly</div><h1>Sign in</h1><div class="alrt" role="alert"><svg class="i" viewBox="0 0 24 24"><use href="#i-alert"/></svg><span>Registration is invite-only right now. Use an invitation link to sign up, or join the waitlist.</span></div><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 40 40"><use href="#lg-github"/></svg>Continue with GitHub</button><button class="b b-s" type="button"><svg class="lgi" viewBox="0 0 18 18"><use href="#lg-google"/></svg>Continue with Google</button><div class="or">or</div><div class="fl"><div class="lab">Email</div><div class="field"><span>alex@studio.dev</span></div></div><div class="fl"><div class="lab">Password<a href="#">Forgot password?</a></div><div class="field"><span class="mu">••••••••••</span></div></div><button class="b b-p" type="button">Sign in</button><div class="alt">New to Commonly? <a href="#">Create an account</a></div></div></div></div></div></figure></div>
+</section>
+
 <section class="surf" id="s-dark">
   <div class="shead"><h2>Dark mode</h2><span class="route">one dark value per token</span></div>
   <div class="dm">