/* ═══ DS v2 · acesso (TL-E01/E02/E23) — só tokens da lei; a moldura é da @roster/ui ═══
   O layout de duas colunas com a fotografia estourada é da tela, não da lei (a lei
   não tem página de acesso), por isso vive aqui. Nada abaixo escreve cor, sombra ou
   raio: tudo é var(). Victor, 09/09/2026. */
.auth { display: grid; grid-template-columns: 5fr 7fr; min-height: 100vh; }
/* PA-04: a tarja da prévia abre o acesso. A lei dá à `.env` a `grid-area: env`, que o `.auth`
   não declara: sem a linha 1 explícita ela caía numa linha implícita no FIM da grade. E a
   linha dela é só a altura dela: a sobra do `min-height` vai para a linha do formulário. */
.auth > .env { grid-column: 1 / -1; grid-row: 1; }
.auth:has(> .env) { grid-template-rows: auto 1fr; }
.auth .col { background: var(--paper); padding: var(--space-6) var(--space-8); display: flex; flex-direction: column; }
/* Jam de 02/10: a 1440×669 (MacBook com a barra do Chrome) o pedido de parceiro rolava 106px.
   Os 72px em cima e embaixo eram só piso: com `margin: auto` o formulário já centraliza quando
   sobra altura. Fica o piso de 24px até a marca; embaixo, o padding da coluna. */
.auth .form { margin: auto 0; max-width: 360px; padding-top: var(--space-5); }
.auth .form .btn.primary { width: 100%; margin-top: var(--space-5); }
/* Jam de 03/10/2026 (Rafael): "alguma coisinha verde, só para sinalizar um checkzinho" — o envio
   do link, na tela de espera, em verde e com o check. */
.auth [data-role="link-sent"] { color: var(--success); white-space: nowrap; }
.auth [data-role="link-sent"] .ico { vertical-align: -0.2em; margin-right: var(--space-1); }
/* A tarja de sandbox entra na conta: sem o calc, toda tela de acesso rolava 32px (crítica de 19/09). Em produção o token é 0px. */
.auth .picture { display: grid; align-content: end; padding: var(--space-6) var(--space-8); min-height: calc(100vh - var(--env-banner-height)); }
.auth .picture .body p { color: var(--paper); font-size: var(--text-section); font-weight: var(--weight-section); letter-spacing: var(--track-section); max-width: 26ch; line-height: 1.25; }
/* No celular a coluna perde os 72px de cada lado: a 375px sobravam 231px e os botões (nowrap) estouravam (crítica de 19/09). */
@media (max-width: 820px) { .auth { grid-template-columns: 1fr; } .auth .col { padding: var(--space-6) var(--space-5); } .auth .picture { display: none; } }