/* Login and Claude's consent page (templates login.html, oauth_consent.html). They stand alone, without base.html
   and its dock: the world, the HUD's wordmark, and one column held low in thumb reach, like Ask. A hidden line takes
   no room, so the column's gap spaces whatever shows. ds.css has everything else. */
.screen.login { --col: 14px; display: flex; flex-direction: column; justify-content: flex-end; gap: var(--col); }
.screen.login > * { margin: 0; }
/* A short sheet (Claude's sign-in sheet on an iPhone SE) still shows the whole consent without scrolling */
@media (max-height: 620px) { .screen.login { --col: 10px; } }
/* An error line sits on the key it is about, as the prototype's "No connection ... Tap Retry." sits on Retry */
.login .errline:not([hidden]) + :is(.btn, form) { margin-top: calc(var(--gap) - var(--col)); }
/* The PIN field and its key are one group, while no Face ID exists (a fresh server, the tests) */
.login form .btn.wide { margin-top: var(--gap); }
.login .ttl { margin: 0 0 4px; }
/* Cancel sits under the consent key, the warning under Cancel (a .note.pool) */
.login .prompt { align-self: flex-start; margin-top: -6px; }