/* Telas de conta (login, convite, equipe): tokens da marca HandyApp (docs/design/MARCA.md). */
:root {
  --green:#0EB082; --green-ink:#087A5C; --navy:#091F29; --info:#123B4A; --blue:#3E6F8E;
  --canvas:#F4F8F7; --card:#FFFFFF; --line:#DCE5E2; --ink:#091F29; --muted:#5B6F77; --no:#D84B4B; --warn:#E8A026;
}
@media (prefers-color-scheme: dark) {
  :root { --canvas:#06151C; --card:#0D2430; --line:#1C3A47; --ink:#EEF4F2; --muted:#93A9B1; }
}
* { box-sizing:border-box; }
body {
  margin:0; min-height:100vh; display:grid; place-items:center; padding:16px;
  background:var(--canvas); color:var(--ink);
  font:15px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
}
a { color:var(--green-ink); }
.card {
  width:100%; max-width:380px; background:var(--card); border:1px solid var(--line);
  border-radius:24px; padding:32px 28px; box-shadow:0 8px 32px rgba(9,31,41,.08);
}
.brand { display:flex; align-items:center; gap:10px; margin-bottom:24px; font-weight:700; font-size:18px; letter-spacing:-.01em; }
.brand img { width:36px; height:36px; }
.brand .app { color:var(--green); }
h1 { font-size:22px; line-height:1.25; margin:0 0 6px; letter-spacing:-.01em; }
h2 { font-size:16px; margin:0 0 12px; }
.sub { color:var(--muted); margin:0 0 22px; font-size:14px; }
label { display:block; font-size:13px; font-weight:600; margin:14px 0 6px; }
input, select {
  width:100%; padding:12px 14px; font:inherit; font-size:16px; background:var(--canvas); color:var(--ink);
  border:1px solid var(--line); border-radius:10px;
}
input:focus, select:focus { outline:2px solid var(--green); outline-offset:1px; border-color:transparent; }
input[readonly] { color:var(--muted); }
button {
  width:100%; margin-top:20px; padding:13px; font:inherit; font-size:15px; font-weight:600;
  border:0; border-radius:10px; background:var(--green); color:#fff; cursor:pointer;
}
button:hover { background:var(--green-ink); }
button:disabled { opacity:.55; cursor:wait; }
button.ghost { background:transparent; color:var(--ink); border:1px solid var(--line); }
button.ghost:hover { background:var(--canvas); }
button.danger { background:transparent; color:var(--no); border:1px solid var(--line); }
.hint { font-size:12px; color:var(--muted); margin-top:6px; }
.err { margin:14px 0 0; font-size:13px; color:var(--no); min-height:18px; }
.foot { margin-top:22px; text-align:center; font-size:12px; color:var(--muted); }
