.vcs-polaris-header {
  min-height: 300px;
  padding: 24px;
  color: #fff;
  background: linear-gradient(100deg, rgba(4, 14, 28, .94), rgba(4, 14, 28, .58)), url('/assets/polaris-twilight.jpeg') center bottom / cover no-repeat;
  font-family: Satoshi, Inter, ui-sans-serif, sans-serif;
}
.vcs-polaris-header-inner { width: min(1240px, 100%); margin: auto; padding-top: 126px; }
.vcs-polaris-header h1 { margin: 0; font-size: clamp(3rem, 7vw, 5.25rem); font-weight: 400; line-height: .92; letter-spacing: -.055em; text-shadow: 0 2px 18px rgba(0, 0, 0, .58); }
.vcs-polaris-header p { max-width: 680px; margin: 1rem 0 0; color: #d8e3ed; font-size: 1rem; line-height: 1.6; text-shadow: 0 1px 10px rgba(0, 0, 0, .72); }
@media (max-width: 620px) { .vcs-polaris-header { min-height: 330px; padding-inline: 14px; } .vcs-polaris-header-inner { padding-top: 142px; } }

/* Keep the Studio's desktop sidebar inside the Studio workspace. The bundled
   app positions it against the viewport, which otherwise covers this header. */
#root { position: relative; }
@media (min-width: 768px) {
  #root [data-slot="sidebar-container"] { position: absolute; }
}

.vcs-auth-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 1.5rem;
  color: #f8f4ea;
  background:
    radial-gradient(circle at 50% 18%, rgba(168, 128, 67, .28), transparent 30rem),
    #10100f;
  font-family: Satoshi, Inter, ui-sans-serif, sans-serif;
}

.vcs-auth-card {
  width: min(100%, 28rem);
  padding: 2rem;
  border: 1px solid rgba(220, 184, 112, .28);
  border-radius: 1.5rem;
  background: rgba(27, 26, 23, .92);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .38);
}

.vcs-auth-kicker {
  margin: 0 0 .75rem;
  color: #dcb870;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.vcs-auth-card h1 { margin: 0; font: 700 2rem/1.05 "Cabinet Grotesk", Satoshi, sans-serif; }
.vcs-auth-copy { margin: .75rem 0 1.5rem; color: #aaa49a; line-height: 1.5; }
.vcs-auth-card label { display: grid; gap: .5rem; font-size: .8rem; font-weight: 700; }
.vcs-auth-card input {
  width: 100%;
  border: 1px solid #48443d;
  border-radius: .8rem;
  padding: .9rem 1rem;
  color: #fff;
  background: #181714;
  font: inherit;
}
.vcs-auth-card button {
  width: 100%;
  margin-top: 1rem;
  border: 0;
  border-radius: .8rem;
  padding: .9rem 1rem;
  color: #18130c;
  background: #dcb870;
  font: 800 .9rem/1 Satoshi, sans-serif;
  cursor: pointer;
}
.vcs-auth-card button:disabled { cursor: wait; opacity: .62; }
.vcs-auth-error { min-height: 1.25rem; margin: .85rem 0 0; color: #f0a39c; font-size: .82rem; }
.vcs-auth-home { display: inline-block; margin-top: 1rem; color: #aaa49a; font-size: .78rem; text-decoration: none; }
.vcs-auth-home:hover { color: #f8f4ea; }