/* ═══════════════════════════════════════════════════════════════════════════
   Login Screen — 프리미엄 다크, Vantablack 기반
   ═══════════════════════════════════════════════════════════════════════════ */
.secms-auth-shell {
  min-height: 100dvh;
  display: grid; place-items: center;
  padding: 24px;
  background:
    radial-gradient(circle at 20% 10%, rgba(29, 78, 216, 0.18), transparent 50%),
    radial-gradient(circle at 85% 90%, rgba(14, 165, 233, 0.12), transparent 50%),
    linear-gradient(135deg, #050510 0%, #0d1220 50%, #131c2e 100%);
  position: relative; overflow: hidden;
}
.secms-auth-shell::before {
  content: ""; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(120, 136, 168, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120, 136, 168, 0.04) 1px, transparent 1px);
  background-size: 32px 32px;
  pointer-events: none;
}
.secms-auth-device {
  width: 100%; max-width: 420px;
  position: relative; z-index: 2;
  padding: 36px 32px 28px;
  background: linear-gradient(180deg, rgba(30, 42, 61, 0.95) 0%, rgba(19, 28, 46, 0.95) 100%);
  border: 1px solid rgba(120, 136, 168, 0.18);
  border-radius: 14px;
  box-shadow:
    0 24px 60px -12px rgba(0,0,0,0.7),
    inset 0 1px 0 rgba(255,255,255,0.06);
  display: flex; flex-direction: column; gap: 14px;
}
.secms-login-logo-wrap {
  display: flex; justify-content: center; margin-bottom: 4px;
}
.secms-login-logo {
  height: 40px; width: auto;
  filter: brightness(1.1);
}
.secms-kicker {
  text-align: center; font-size: 10px; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--brand-cyan); opacity: 0.85;
}
.secms-login-title {
  text-align: center; margin: 0;
  font-size: 22px; font-weight: 800; letter-spacing: -0.01em;
  color: var(--m-text-bright);
}
.secms-login-sub {
  text-align: center; margin: 0 0 8px;
  font-size: 12px; color: var(--m-text-sub); line-height: 1.5;
  word-break: keep-all;
}
.name-gate-field {
  display: flex; flex-direction: column; gap: 5px;
}
.name-gate-field span {
  font-size: 11px; font-weight: 700;
  color: var(--m-text-tri); letter-spacing: 0.04em;
}
.name-gate-field input {
  padding: 10px 12px; border-radius: 8px;
  background: rgba(13, 18, 32, 0.7);
  border: 1px solid rgba(120, 136, 168, 0.24);
  color: var(--m-text-bright); font-size: 14px;
  transition: border-color var(--t-fast), background var(--t-fast);
}
.name-gate-field input:focus {
  outline: none;
  border-color: var(--brand-cyan);
  background: rgba(13, 18, 32, 0.9);
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.15);
}
.name-gate-actions {
  display: grid; grid-template-columns: 1fr auto; gap: 8px;
  margin-top: 4px;
}
.secms-primary-btn {
  height: 42px; border: none; border-radius: 8px;
  background: linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%);
  color: #fff; font-size: 14px; font-weight: 700; letter-spacing: 0.02em;
  transition: transform var(--t-fast) var(--ease-out), box-shadow var(--t-fast);
  box-shadow: 0 6px 16px -4px rgba(29, 78, 216, 0.5);
}
.secms-primary-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 22px -6px rgba(29, 78, 216, 0.6); }
.secms-primary-btn:active { transform: translateY(0); }
.name-gate-admin {
  width: 42px; height: 42px;
  border-radius: 8px; border: 1px solid rgba(120, 136, 168, 0.24);
  background: rgba(30, 42, 61, 0.6);
  color: var(--m-text-tri); font-size: 16px;
  transition: background var(--t-fast);
}
.name-gate-admin:hover { background: rgba(46, 58, 82, 0.8); color: var(--m-text-bright); }
.secms-contact-link {
  display: block; text-align: center; margin-top: 6px;
  font-size: 11px; color: var(--m-text-sub);
  text-decoration: none;
}
.secms-contact-link:hover { color: var(--brand-cyan); }
.secms-footer-note {
  text-align: center; font-size: 10px;
  color: var(--m-text-muted); letter-spacing: 0.1em;
}