/* Pages login et compte (s'ajoute à home.css) */
main.section { padding-top: 56px; }
.narrow { max-width: 600px; }
.panel { padding: 1.6rem; margin-bottom: 1rem; border: 1px solid var(--line); background: var(--glass); border-radius: var(--radius); }
.panel h1, .panel h2 { margin-bottom: .5rem; }
.panel h1 { font-size: 1.6rem; }
.panel h2 { font-size: 1.1rem; }

.form { display: grid; gap: 1rem; }
.form label { display: grid; gap: .3rem; font-weight: 500; font-size: .9rem; }
.form small { font-weight: 400; color: var(--muted); }
.form input, .form select { font: .95rem var(--mono); padding: .6rem .75rem; border-radius: 6px; border: 1px solid var(--line); background: var(--bg); color: var(--text); }
.form input:focus-visible, .form select:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.form .btn { justify-self: start; }
.form .btn:disabled { opacity: .6; cursor: wait; }
.form-links { margin: 0; font-size: .9rem; color: var(--muted); }
.form-links a { color: var(--accent); }
.form-inline { grid-template-columns: 1fr 2fr auto; align-items: end; }

.notice { padding: .7rem 1rem; border-radius: 6px; margin: 0 0 1rem; border: 1px solid var(--line); background: var(--bg2); font-size: .9rem; }
.notice-ok { border-color: var(--accent); }
.notice-error { border-color: var(--danger); }
.notice-warn { border-color: var(--warn); }

.invites { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .5rem; }
.invites li { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; padding: .6rem 0; border-top: 1px solid var(--line); }

@media (max-width: 720px) { .form-inline { grid-template-columns: 1fr; } }

.avatar-edit { display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.2rem; flex-wrap: wrap; }
.avatar-edit small { display: block; margin-top: .5rem; }
.btn-sm { padding: .4rem .9rem; font-size: .8rem; }