:root {
  --ov-bg-a: #f6fbf8;
  --ov-bg-b: #e6f4ee;
  --ov-card: rgba(255, 255, 255, 0.92);
  --ov-border: rgba(36, 102, 90, 0.16);
  --ov-text: #18443c;
  --ov-muted: #4e736b;
  --ov-accent: #1f7a67;
  --ov-accent-strong: #145c4d;
  --ov-danger: #b3261e;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
}

body {
  font-family: 'Manrope', sans-serif;
  color: var(--ov-text);
  background:
    radial-gradient(1200px 700px at 120% -10%, rgba(57, 143, 125, 0.18), transparent 60%),
    radial-gradient(1000px 620px at -20% 110%, rgba(39, 122, 103, 0.16), transparent 60%),
    linear-gradient(160deg, var(--ov-bg-a), var(--ov-bg-b));
}

.ov-login-page {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 20px;
}

.ov-login-shell {
  width: min(100%, 460px);
  border-radius: 24px;
  background: var(--ov-card);
  border: 1px solid var(--ov-border);
  box-shadow: 0 28px 60px rgba(18, 68, 59, 0.16);
  padding: 28px 24px;
  backdrop-filter: blur(8px);
}

.ov-login-brand {
  text-align: center;
  margin-bottom: 18px;
}

.ov-login-logo {
  width: 150px;
  max-width: 70%;
  height: auto;
  display: block;
  margin: 0 auto 10px;
}

.ov-login-kicker {
  margin: 0;
  font-family: 'Space Grotesk', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.76rem;
  color: var(--ov-muted);
}

.ov-login-brand h1 {
  margin: 8px 0 0;
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(1.4rem, 4.4vw, 1.85rem);
  line-height: 1.15;
}

.ov-login-form {
  display: grid;
  gap: 14px;
}

.ov-field {
  display: grid;
  gap: 7px;
}

.ov-field span {
  font-weight: 700;
  font-size: 0.92rem;
}

.ov-field input {
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(22, 92, 78, 0.24);
  background: #fff;
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 16px;
  color: var(--ov-text);
  outline: none;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.ov-field input:focus {
  border-color: var(--ov-accent);
  box-shadow: 0 0 0 4px rgba(31, 122, 103, 0.14);
}

.ov-feedback {
  min-height: 22px;
  margin: 0;
  color: var(--ov-danger);
  font-size: 0.9rem;
  font-weight: 600;
}

.ov-feedback.is-ok {
  color: var(--ov-accent-strong);
}

.ov-login-btn {
  min-height: 48px;
  border: 0;
  border-radius: 14px;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #fff;
  background: linear-gradient(140deg, #1f7a67, #145c4d);
  box-shadow: 0 16px 26px rgba(20, 92, 77, 0.26);
  transition: transform 0.14s ease, box-shadow 0.14s ease, filter 0.14s ease;
}

.ov-login-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.02);
}

.ov-login-btn:active {
  transform: translateY(0);
}

.ov-login-btn:disabled {
  opacity: 0.75;
  cursor: not-allowed;
  transform: none;
}

@media (max-width: 480px) {
  .ov-login-page {
    padding: 14px;
  }

  .ov-login-shell {
    border-radius: 18px;
    padding: 22px 16px;
  }
}