#login-screen {
  position: fixed; inset: 0;
  display: flex; align-items: center; justify-content: center;
  z-index: 100;
  background: var(--bg);
}

.login-box {
  width: 100%; max-width: 400px;
  padding: 40px;
  border: 1px solid var(--border-hover);
  border-radius: 2px;
  background: var(--bg-1);
  position: relative;
  animation: bootUp .6s ease both;
}

.login-box::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--green), transparent);
  animation: scanLine 3s ease-in-out infinite;
}

.login-logo { text-align: center; margin-bottom: 32px; }

.login-logo-icon {
  width: 56px; height: 56px;
  border: 2px solid var(--green);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px;
  box-shadow: 0 0 24px var(--green-glow), inset 0 0 24px var(--green-dark);
  animation: pulse 2s ease infinite;
}
.login-logo-icon svg { width: 24px; height: 24px; stroke: var(--green); fill: none; stroke-width: 1.5; }

.login-title {
  font-family: var(--font-display);
  font-size: 22px; font-weight: 700;
  color: var(--green); letter-spacing: .15em; margin-bottom: 4px;
}
.login-sub { font-size: 10px; color: var(--text-3); letter-spacing: .1em; text-transform: uppercase; }

.login-label {
  font-size: 10px; font-weight: 600;
  color: var(--text-3); letter-spacing: .1em;
  text-transform: uppercase; margin-bottom: 6px;
  display: block; margin-top: 16px;
}

.login-input {
  width: 100%;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 11px 14px;
  font-family: var(--font-mono);
  font-size: 13px; color: var(--text-1);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  caret-color: var(--green);
}
.login-input:focus {
  border-color: var(--green-dim);
  box-shadow: 0 0 0 3px var(--green-dark);
}
.login-input::placeholder { color: var(--text-3); }

.login-btn {
  width: 100%; padding: 12px; margin-top: 20px;
  background: transparent;
  border: 1px solid var(--green);
  border-radius: 2px;
  font-family: var(--font-display);
  font-size: 13px; font-weight: 600;
  color: var(--green); letter-spacing: .1em; text-transform: uppercase;
  cursor: pointer; transition: all .2s;
  position: relative; overflow: hidden;
}
.login-btn::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--green);
  transform: translateX(-100%);
  transition: transform .25s ease; z-index: 0;
}
.login-btn:hover::before { transform: translateX(0); }
.login-btn:hover { color: var(--bg); }
.login-btn span { position: relative; z-index: 1; }

.login-error {
  font-size: 11px; color: var(--red);
  text-align: center; margin-top: 12px;
  display: none; animation: fadeIn .2s ease;
}
.login-error.show { display: block; }