/* ---- LOGIN GATE ---- */
.login-gate {
  position:fixed; inset:0; z-index:99999;
  background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  flex-direction:column;
  overflow:hidden;
}
.login-gate.hidden { display:none; }
/* Animated background */
.login-gate::before {
  content:''; position:absolute; inset:-50%;
  background:conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(232,87,58,0.03) 60deg, transparent 120deg, rgba(204,255,0,0.02) 180deg, transparent 240deg, rgba(232,87,58,0.03) 300deg, transparent 360deg);
  animation:loginSpin 20s linear infinite;
}
@keyframes loginSpin { to { transform:rotate(360deg); } }
/* Dashed circles */
.login-gate::after {
  content:''; position:absolute;
  width:500px; height:500px;
  border:1.5px dashed rgba(232,87,58,0.12);
  border-radius:50%;
  animation:loginSpin 30s linear infinite reverse;
}
/* Ghost text */
.login-ghost {
  position:absolute; font-size:clamp(120px,20vw,280px);
  font-weight:900; text-transform:uppercase;
  color:rgba(255,255,255,0.015); letter-spacing:-8px;
  pointer-events:none; white-space:nowrap;
}
.login-ghost.g1 { top:10%; left:-5%; }
.login-ghost.g2 { bottom:8%; right:-5%; }

.login-box {
  width:380px; padding:48px 40px;
  background:rgba(17,17,17,0.85);
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
  border:1px solid rgba(255,255,255,0.04);
  text-align:center; position:relative; z-index:1;
}
/* Corner accents — Sawad DNA */
.login-box::before, .login-box::after {
  content:''; position:absolute; width:16px; height:16px;
}
.login-box::before { top:-1px; left:-1px; border-top:2px solid var(--o); border-left:2px solid var(--o); }
.login-box::after { bottom:-1px; right:-1px; border-bottom:2px solid var(--l); border-right:2px solid var(--l); }

.login-logo {
  width:52px; height:52px; background:var(--o);
  display:flex; align-items:center; justify-content:center;
  font-weight:900; font-size:20px; color:#000;
  margin:0 auto 24px;
  box-shadow:0 0 30px rgba(232,87,58,0.2);
}
.login-title {
  font-size:22px; font-weight:900;
  text-transform:uppercase; letter-spacing:3px;
  margin-bottom:4px;
}
.login-title span { color:var(--l); }
.login-sub {
  font-size:9px; color:var(--t3);
  letter-spacing:2px; text-transform:uppercase;
  margin-bottom:32px;
}
.login-input {
  width:100%; padding:14px 16px;
  background:var(--bg); border:1px solid var(--s3);
  color:var(--t); font-family:var(--m); font-size:13px;
  outline:none; transition:border-color .3s, box-shadow .3s;
  margin-bottom:10px;
}
.login-input[type="password"] { -webkit-text-security:disc; }
.login-input:focus { border-color:var(--o); box-shadow:0 0 12px rgba(232,87,58,0.1); }
.login-input::placeholder { color:var(--t3); }
.login-btn {
  width:100%; padding:14px;
  background:var(--o); color:#000;
  font-size:10px; font-weight:800;
  letter-spacing:3px; text-transform:uppercase;
  cursor:pointer; border:none; font-family:var(--f);
  transition:all .3s;
  box-shadow:0 4px 20px rgba(232,87,58,0.15);
}
.login-btn:hover { background:var(--o2); box-shadow:0 6px 30px rgba(232,87,58,0.25); transform:translateY(-1px); }
.login-error {
  font-size:10px; color:var(--r);
  margin-top:12px; min-height:16px;
  font-family:var(--m);
}
.login-footer {
  margin-top:28px; font-size:8px; color:var(--t3);
  letter-spacing:2px; text-transform:uppercase;
  position:relative; z-index:1;
}
.login-version {
  margin-top:8px; font-size:7px; color:rgba(255,255,255,0.08);
  font-family:var(--m); letter-spacing:1px;
}
.app.locked { filter:blur(20px); pointer-events:none; user-select:none; }