/* Sign-in page: factory video behind a quiet card. */

.st-login { position: relative; min-height: 100dvh; display: grid; place-items: center; padding: 24px 16px; overflow: hidden; }

.st-login__media { position: fixed; inset: 0; z-index: 0; background: #0d1c1c center / cover no-repeat; }
.st-login__media video { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(1.15) contrast(1.06); }
.st-login__media::after {
  /* Forest-tinted scrim keeps the card readable over any frame of the video. */
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10, 22, 22, .08) 0%, rgba(10, 22, 22, .22) 100%);
}

.st-login__card {
  position: relative; z-index: 1; width: min(400px, 100%);
  padding: 28px 28px 22px; border-radius: var(--st-radius-lg);
  background: color-mix(in srgb, var(--st-surface) 94%, transparent);
  border: 1px solid color-mix(in srgb, var(--st-border) 70%, transparent);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .28);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.st-login__logo { display: flex; justify-content: center; margin-bottom: 14px; }
.st-login__logo img { height: 74px; width: auto; }
.st-login__title { text-align: center; font-size: var(--st-text-xl); }
.st-login__subtitle { text-align: center; color: var(--st-text-muted); margin: 4px 0 20px; font-size: var(--st-text-md); }

.st-segmented { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-bottom: 1px solid var(--st-border); margin-bottom: 16px; }
.st-segmented__btn {
  position: relative; min-height: 36px; border: 0; background: transparent;
  font-weight: 600; font-size: var(--st-text-md); color: var(--st-text-muted);
}
.st-segmented__btn[aria-selected="true"] { color: var(--st-text); }
.st-segmented__btn[aria-selected="true"]::after {
  content: ""; position: absolute; left: 20%; right: 20%; bottom: -1px; height: 2px; border-radius: 2px; background: var(--st-accent);
}

.st-login__foot { margin-top: 14px; font-size: var(--st-text-sm); color: var(--st-text-muted); text-align: center; }
.st-login__brandline { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--st-border);
  text-align: center; font-size: var(--st-text-xs); color: var(--st-text-faint); }