/* Acceso · Selia Marketing. Compone la pantalla con tokens y piezas de la guía (Card, TextField, Button, Notice).
   Se carga la última, después de app.css. */
body { min-height: 100vh; min-height: 100dvh; }
.lg-layout { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-5); min-height: 100vh; min-height: 100dvh; max-width: 480px; margin: 0 auto; padding: var(--space-6) var(--space-4); box-sizing: border-box; }
.lg-brand { display: flex; align-items: center; justify-content: center; gap: var(--space-3); }
.lg-brand .sm-sidebar__symbol { width: 40px; height: 40px; }
.lg-brand .sm-sidebar__app { font-size: 26px; }
.lg-card { width: 100%; padding: var(--space-6); box-sizing: border-box; }
.lg-eyebrow { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); }
.lg-title { margin: var(--space-2) 0 var(--space-2); font-size: 30px; }
.lg-lead { margin: 0 0 var(--space-5); font-size: 15px; font-weight: 500; line-height: 1.55; color: var(--ink-secondary); }
.lg-card .sm-field { margin: 0 0 var(--space-4); }
.lg-card .sm-input { font-size: 16px; }
.lg-card .sm-notice[hidden], .lg-card .sm-field__foot[hidden] { display: none; }
.lg-error { margin: 0 0 var(--space-4); }
.lg-reveal { display: grid; }
.lg-submit { margin: var(--space-2) 0 var(--space-5); }
.lg-help { margin: 0 0 var(--space-3); font-size: 13px; font-weight: 500; line-height: 1.55; color: var(--ink-muted); }
.lg-link { font-size: 14px; }
.lg-foot { font-size: 13px; font-weight: 500; color: var(--ink-muted); text-align: center; }
@media (max-width: 560px) {
  .lg-layout { justify-content: flex-start; padding-top: var(--space-6); }
  .lg-card { padding: 20px; }
}