/* G12 B: vstup na heslo — design hry (žlutá / černá, Saira, šikmé tlačítko). Mobil i PC bez vodorovného rolování. */
.gate-body { min-height: 100vh; min-height: 100dvh; }
.gate {
  flex: 1; display: flex; align-items: center; justify-content: center; padding: 24px 16px;
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 178, 30, .10), transparent 60%), var(--color-bg);
}
.gate__card {
  width: 100%; max-width: 400px; display: flex; flex-direction: column; align-items: stretch; gap: 14px;
  padding: 28px 24px 22px; background: var(--color-surface); border: 1px solid var(--color-surface-2);
  border-top: 4px solid var(--color-accent); box-shadow: 0 18px 48px rgba(0, 0, 0, .45); text-align: center;
}
.gate__logo { display: flex; align-items: center; justify-content: center; gap: 10px; }
.gate__bar { width: 34px; height: 12px; }
.gate__name { font-size: 30px; }
.gate__heading { margin: 4px 0 0; font-size: 26px; font-weight: 900; font-style: italic; font-stretch: 75%;
  text-transform: uppercase; letter-spacing: .02em; color: var(--color-text); }
.gate__lead { margin: 0; color: var(--soft); font-size: 15px; line-height: 1.45; }
.gate__field { position: relative; }
.gate__input {
  width: 100%; min-height: 50px; padding: 12px 52px 12px 14px; font: inherit; font-size: 17px;
  color: var(--color-text); background: var(--color-bg); border: 2px solid var(--color-surface-2); border-radius: 0;
}
.gate__input:focus { outline: none; border-color: var(--color-accent); }
.gate__input:disabled { opacity: .5; }
.gate__eye {
  position: absolute; top: 0; right: 0; width: 50px; height: 100%; display: flex; align-items: center;
  justify-content: center; background: none; border: 0; color: var(--color-muted); cursor: pointer;
}
.gate__eye[aria-pressed="true"] { color: var(--color-accent); }
.gate__error { margin: -4px 0 0; color: var(--color-bad); font-weight: 700; font-size: 15px; }
.gate__submit { width: 100%; justify-content: center; margin-top: 4px; }
.gate__stay { margin: 0; color: var(--color-muted); font-size: 13px; }
.gate__langs { display: flex; justify-content: center; gap: 8px; }
.gate__lang {
  min-width: 44px; min-height: 34px; display: inline-flex; align-items: center; justify-content: center;
  padding: 4px 10px; font-size: 13px; font-weight: 800; color: var(--color-text); text-decoration: none;
  border: 1px solid rgba(227, 232, 238, .2); transform: skewX(var(--skew));
}
.gate__lang[aria-current="true"] { background: var(--color-accent); color: var(--color-bg); border-color: var(--color-accent); }
@media (max-width: 360px) { .gate__card { padding: 22px 16px 18px; } .gate__name { font-size: 26px; } }
