/* layout.css — estructura: cabecera de la app, contenedor y encuadre de autenticación. */
.appbar{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.72);
  backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--border)}
.appbar .bar{max-width:var(--container);margin-inline:auto;padding:0 var(--space-6);height:64px;display:flex;align-items:center;gap:var(--space-4)}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:-.01em;color:var(--text)}
.brand .mark{width:28px;height:28px;border-radius:8px;background:var(--accent);display:grid;place-items:center;
  box-shadow:0 2px 8px rgba(43,108,255,.35)}
.brand .mark svg{width:17px;height:17px;color:#fff}
.brand b{color:var(--accent)}
.appbar .spacer{flex:1}
.appbar .who{font-size:var(--fs-sm);color:var(--text-2);font-weight:500}

.container{max-width:var(--container);margin-inline:auto;padding:var(--space-10) var(--space-6)}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--space-6);flex-wrap:wrap;margin-bottom:var(--space-8)}
.page-head h1{font-size:var(--fs-h2);font-weight:700;letter-spacing:-.02em}
.page-head p{color:var(--text-2);margin-top:5px}

/* Autenticación centrada */
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:var(--space-6)}
.auth-card{width:100%;max-width:410px}
.auth-card .brand{justify-content:center;font-size:1.3rem;margin-bottom:var(--space-6)}
.auth-card .card{box-shadow:var(--shadow-md),var(--ring-inset)}
.auth-switch{margin-top:var(--space-5);text-align:center;color:var(--text-2);font-size:var(--fs-sm)}

.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--text-2);font-size:var(--fs-sm);
  font-weight:500;margin-bottom:var(--space-5);transition:color var(--dur) var(--ease)}
.back-link:hover{color:var(--text);text-decoration:none}