.auth-container{max-width:440px;margin:clamp(4rem,10vw,7rem) auto 3rem;padding:2rem;background:rgba(20,22,27,.82);border:1px solid rgba(255,255,255,.08);border-radius:20px;box-shadow:0 20px 70px rgba(0,0,0,.35);backdrop-filter:blur(22px)}.auth-container input{width:100%;box-sizing:border-box;margin-bottom:1rem;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.05);color:#f5f7fa;padding:.95rem}.auth-container input:focus{outline:2px solid rgba(255,255,255,.35);outline-offset:2px}.auth-container .watch-btn{width:100%;min-height:46px}.auth-divider{text-align:center;color:#777f8b;margin:1rem 0}.google-auth{background:rgba(255,255,255,.08)!important;color:#fff}.auth-switch{text-align:center;margin-top:1rem;color:#9aa1ab}.auth-switch a{color:#fff;font-weight:600}.error-msg{min-height:1.3rem;font-size:.9rem;margin-bottom:1rem;color:#ff6b6b}

/* Phase 3 — auth: cinematic entry, not a generic form. */
body[data-vivid-page="auth"]{
  min-height:100dvh;
  background:
    radial-gradient(circle at 78% 18%,rgba(255,255,255,.065),transparent 26%),
    radial-gradient(circle at 15% 80%,rgba(255,255,255,.045),transparent 30%),
    #06070a;
}
body[data-vivid-page="auth"] .auth-container{
  position:relative;
  isolation:isolate;
}
body[data-vivid-page="auth"] .auth-container::before{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  right:-230px;
  top:5%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.065),transparent 68%);
  filter:blur(24px);
  z-index:-1;
  pointer-events:none;
}
body[data-vivid-page="auth"] .auth-container h1{
  letter-spacing:-.055em;
  font-size:clamp(2.5rem,7vw,4.8rem);
}
body[data-vivid-page="auth"] .auth-container>p{
  color:#8e959f;
  max-width:520px;
}
body[data-vivid-page="auth"] form,
body[data-vivid-page="auth"] .google-auth{
  box-shadow:0 20px 60px rgba(0,0,0,.22);
}
body[data-vivid-page="auth"] input:focus{
  border-color:rgba(255,255,255,.28)!important;
  box-shadow:0 0 0 4px rgba(255,255,255,.05),0 16px 45px rgba(0,0,0,.18)!important;
}
@media(prefers-reduced-motion:reduce){
  body[data-vivid-page="auth"] *{scroll-behavior:auto}
}

.password-field{position:relative;margin-bottom:1rem}.password-field input{margin-bottom:0!important;padding-right:70px}.password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#aeb4bd;padding:8px;cursor:pointer;font-weight:600}.password-toggle:hover{color:#fff}.auth-help-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 8px;color:#9aa1ab;font-size:.88rem}.auth-help-row a{color:#fff;text-decoration:none}.auth-help-row a:hover{text-decoration:underline}.auth-text-button{border:0;background:transparent;color:#8f98a3;padding:4px 0;cursor:pointer;font:inherit}.auth-text-button:hover{color:#fff}.auth-text-button:disabled{opacity:.5;cursor:wait}.auth-container .watch-btn:disabled{opacity:.58;cursor:wait}.auth-container input:disabled{opacity:.65}


/* Auth screens share the newsroom accent while retaining clear error/success colors. */
body[data-vivid-page="auth"] .auth-container h1{font-family:Georgia,"Times New Roman",serif;letter-spacing:-.05em}
body[data-vivid-page="auth"] .auth-container input:focus{border-color:rgba(199,255,85,.55)!important;outline-color:rgba(199,255,85,.35)!important;box-shadow:0 0 0 3px rgba(199,255,85,.08)!important}
body[data-vivid-page="auth"] .auth-container a:focus-visible,body[data-vivid-page="auth"] .auth-container button:focus-visible{outline:2px solid #c7ff55;outline-offset:3px}