/* BLACK IA -- tela de entrar / criar conta (e "Minha conta"). Mesma identidade do app: cinza escuro + laranja, Bebas e Roboto Condensed. */
@font-face { font-family:"RobotoCond"; src:url("fonts/RobotoCondensed-Bold-latin.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"Bebas"; src:url("fonts/BebasNeue-latin.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
:root { --bg:#0e0e10; --card:#1a1a1f; --borda:#2c2c34; --texto:#f2f2f2; --suave:#a0a0ab; --laranja:#ff5a1f; --erro:#ff6b6b; --ok:#4cd07d;
  --cond:"RobotoCond","Arial Narrow","Roboto Condensed","Helvetica Neue",Arial,sans-serif; --bebas:"Bebas","RobotoCond","Arial Narrow",Arial,sans-serif; }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { min-height:100%; }
body { margin:0; min-height:100dvh; color:var(--texto); font:16px/1.45 system-ui, sans-serif;
  background:linear-gradient(180deg, rgba(14,14,16,.25), rgba(14,14,16,.93) 52%, #0e0e10 78%), repeating-linear-gradient(180deg, #14361a 0 70px, #112d16 70px 140px) #0e0e10; background-attachment:fixed; }
main { max-width:440px; margin:0 auto; padding:calc(34px + env(safe-area-inset-top)) 18px calc(26px + env(safe-area-inset-bottom)); }

.marca { text-align:center; }
.logo { width:86px; height:86px; margin:0 auto; border-radius:50%; background:#fff; border:3px solid #fff; overflow:hidden; display:grid; place-items:center; box-shadow:0 8px 20px rgba(0,0,0,.5); }
.logo img { width:100%; height:100%; object-fit:cover; display:block; }
h1 { margin:14px 0 0; font:400 46px/1 var(--bebas); letter-spacing:.06em; }
h1 span { color:var(--laranja); }
.tag { margin:6px 0 0; color:#cfd3da; font-size:.92rem; }
h2 { margin:0 0 10px; font:700 1.05rem var(--cond); letter-spacing:.06em; text-transform:uppercase; }

.vidro { margin:22px 0 0; padding:8px 18px 20px; background:rgba(26,26,31,.84); border:1px solid rgba(255,255,255,.14); border-radius:18px; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
#tela-app .vidro { padding:18px; display:grid; gap:10px; }
.quem { display:block; word-break:break-all; font-size:.95rem; }

.abas { display:flex; margin-top:12px; padding:4px; background:#111; border:1px solid var(--borda); border-radius:12px; }
.abas button { flex:1; min-width:0; padding:10px 4px; border:0; border-radius:9px; background:transparent; color:var(--suave); font:700 .84rem var(--cond); letter-spacing:.03em; text-transform:uppercase; white-space:nowrap; }
.abas button.ativa { background:var(--laranja); color:#111; }

label { display:block; margin:14px 0 6px; font:700 .76rem var(--cond); letter-spacing:.06em; text-transform:uppercase; color:var(--suave); }
input[type=email], input[type=password], input[type=text], input:not([type]) { width:100%; height:50px; padding:0 14px; border-radius:12px; border:1px solid #34343e; background:#111; color:var(--texto); font-size:1rem; }
input:focus { outline:2px solid var(--laranja); outline-offset:1px; border-color:transparent; }
input::placeholder { color:#6c6c78; }
#convite { text-transform:uppercase; letter-spacing:.08em; }

.campo-senha { position:relative; }
.campo-senha input { padding-right:56px; }
.ver { position:absolute; right:5px; top:5px; width:40px; height:40px; padding:0; display:grid; place-items:center; border:0; border-radius:10px; background:transparent; color:var(--suave); }
.ver svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ver .risco { display:none; }
.ver.ligado { color:var(--laranja); }
.ver.ligado .risco { display:block; }

.aceite { display:flex; gap:10px; align-items:center; margin:16px 0 0; font:400 .85rem system-ui, sans-serif; letter-spacing:0; text-transform:none; color:var(--suave); }
.aceite input { width:20px; height:20px; margin:0; accent-color:var(--laranja); flex:none; }
.aceite a { color:#ff8a5c; }

button { font-family:inherit; cursor:pointer; }
.principal, .sec, .perigo, .bt-link { display:grid; place-items:center; width:100%; min-height:52px; border-radius:12px; font:700 1rem var(--cond); letter-spacing:.06em; text-transform:uppercase; text-decoration:none; }
.principal { border:0; background:linear-gradient(#ff7040, var(--laranja)); color:#111; box-shadow:0 6px 16px rgba(255,90,31,.35); }
#btn-auth { margin-top:18px; }
.sec { border:1.5px solid var(--borda); background:transparent; color:var(--texto); }
.perigo { border:1.5px solid var(--erro); background:transparent; color:var(--erro); font-size:.95rem; height:46px; }
button:disabled { opacity:.6; cursor:wait; }

.msg { margin-top:12px; min-height:1.2em; font-size:.9rem; text-align:center; }
.msg.erro { color:var(--erro); }
.msg.ok { color:var(--ok); }

.priv { margin:14px 0 0; border:1px solid var(--borda); border-radius:12px; padding:10px 14px; color:var(--suave); font-size:.85rem; background:rgba(14,14,16,.6); }
.priv summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; }
.priv summary::after { content:"▾"; }
.priv[open] summary::after { content:"▴"; }
.priv p { margin:10px 0 0; }
.rodape { margin:14px 0 0; text-align:center; font-size:.8rem; color:var(--suave); }

.time { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--borda); }
.time:first-child { border-top:0; }
.time small { color:var(--suave); display:block; }
.time .perigo { width:auto; height:38px; padding:0 14px; font-size:.85rem; }
.oculto { display:none !important; }