/* --- LOGIN MODAL STYLES (Added) --- */
.modal {
  display: none; position: fixed; z-index: 5000; left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.5);
  justify-content: center; align-items: center;
}
.modal-content {
  background: white; border-radius: 20px;
  width: 350px; max-width: 90%;
  padding: 0; 
  box-shadow: 0 5px 15px rgba(0,0,0,0.3); position: relative;
  text-align: center;
}
.close { position: absolute; top: 15px; right: 20px; font-size: 24px; cursor: pointer; z-index: 10; }

/* Login/Profile Internal Views */
#login-form, #profile { padding: 35px; }
.hidden { display: none !important; }

#avatar { width: 80px; border-radius: 50%; margin-bottom: 10px; border: 3px solid #007bff; }
#g_id_signin { display: flex; justify-content: center; margin-bottom: 10px; }
#logout-btn { background: #ff4d4d; color: white; border: none; padding: 8px 16px; border-radius: 5px; margin-top: 15px; cursor: pointer; }
.divider { margin: 15px 0; color: #aaa; font-size: 0.9em; }
.brand { color: var(--primary, #C84A3A); padding-bottom: 10px; }