/* ═══ AUTH — clean, premium, monochrome ═══ */
#authScreen{
  position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  background:var(--bg);overflow-y:auto;z-index:var(--z-call);
  padding:max(20px,var(--st)) 16px max(20px,var(--sb));
}

#authBubbles{position:fixed;inset:0;pointer-events:none;z-index:0}

#authCard{
  position:relative;width:100%;max-width:370px;
  padding:36px 32px 32px;
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:var(--r-xl);
  animation:slideUp .5s var(--ease-out);
  overflow:hidden;z-index:1;
  box-shadow:var(--shadow-xl);
}
#authCard::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent 10%,rgba(255,255,255,.08) 50%,transparent 90%);
  pointer-events:none;
}

.auth-logo{text-align:center;margin-bottom:4px;display:flex;flex-direction:column;align-items:center;gap:8px}
.auth-logo-icon{
  width:64px;height:64px;border-radius:var(--r-xl);overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--surface-1);border:1px solid var(--border);
  box-shadow:var(--shadow-md);
}
.auth-logo-icon img{width:80%;height:80%;object-fit:contain}
.auth-logo-text{
  display:block;font-size:24px;font-weight:var(--weight-extra);letter-spacing:5px;
  color:var(--text);
}
.auth-tag{
  text-align:center;font-size:var(--text-2xs);letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);margin-bottom:28px;
}

/* Form */
.form-group{margin-bottom:14px}
.form-label{
  display:block;font-size:var(--text-xs);font-weight:var(--weight-bold);
  letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--muted);margin-bottom:6px;
}
.form-input-wrap{position:relative;display:flex;align-items:center}
.form-icon{
  position:absolute;left:14px;width:15px;height:15px;color:var(--text-faint);
  pointer-events:none;transition:color var(--dur-normal);
}
.form-input-wrap:focus-within .form-icon{color:var(--text-secondary)}

#authCard .form-input{
  width:100%;background:var(--surface-0);
  border:1px solid var(--border);border-radius:var(--r-lg);
  font-size:var(--text-md);padding:11px 16px 11px 40px;
  color:var(--text);transition:border-color var(--dur-fast),box-shadow var(--dur-fast),background var(--dur-fast);
}
#authCard .form-input::placeholder{color:var(--text-faint)}
#authCard .form-input:focus{
  border-color:var(--border-hover);
  box-shadow:0 0 0 3px rgba(255,255,255,.04);
  outline:none;background:var(--surface-1);
}

input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px var(--bg2) inset!important;
  -webkit-text-fill-color:var(--text)!important;caret-color:var(--text);
  transition:background-color 9999s;
}

/* Buttons — monochrome, clean */
.auth-btn{
  display:block;width:100%;padding:12px 20px;border:none;border-radius:var(--r-lg);
  font-size:var(--text-sm);font-weight:var(--weight-bold);letter-spacing:var(--tracking-wide);
  text-transform:uppercase;cursor:pointer;
  font-family:var(--font);transition:background var(--dur-fast),color var(--dur-fast),box-shadow var(--dur-fast),transform var(--dur-fast);
}
.auth-btn-primary{
  background:#fff;color:#000;margin-top:8px;
  box-shadow:0 2px 10px rgba(255,255,255,.08);
}
.auth-btn-primary:hover{
  background:#eee;transform:translateY(-1px);
  box-shadow:0 4px 16px rgba(255,255,255,.12);
}
.auth-btn-primary:active{transform:translateY(0)}
.auth-btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none}

.auth-btn-secondary{
  background:transparent;color:var(--text-secondary);margin-top:10px;
  border:1px solid var(--border);
}
.auth-btn-secondary:hover{
  background:var(--surface-hover);border-color:var(--border-hover);color:var(--text);
}
.auth-btn-secondary:active{background:var(--surface-active)}
.auth-btn-secondary:disabled{opacity:.4;cursor:not-allowed}

.auth-footer{
  text-align:center;font-size:var(--text-xs);color:var(--muted);margin-top:20px;
  line-height:var(--leading-normal);
}

.auth-msg{
  padding:10px 14px;border-radius:var(--r-md);
  font-size:var(--text-sm);margin-bottom:14px;display:none;animation:fadeUp .25s;
  line-height:var(--leading-snug);
}
.auth-msg.show{display:block}
.auth-msg.error{background:rgba(229,62,62,.06);border:1px solid rgba(229,62,62,.15);color:rgba(229,62,62,.9)}
.auth-msg.success{background:var(--surface-1);border:1px solid var(--border);color:var(--text-secondary)}

/* ═══ LOADING ═══ */
#loadingOverlay{
  position:fixed;inset:0;background:rgba(9,9,11,.96);
  display:none;align-items:center;justify-content:center;
  z-index:var(--z-call-in);flex-direction:column;gap:14px;
}
#loadingOverlay.show{display:flex}
.spinner{
  width:28px;height:28px;
  border:2px solid rgba(255,255,255,.08);border-top-color:var(--text);
  border-radius:50%;animation:spin .7s linear infinite;
}
.loading-text{font-size:var(--text-xs);color:var(--muted);letter-spacing:2px;text-transform:uppercase}
