:root {
  --athena-bg: #070a0f;
  --athena-panel: rgba(12, 18, 28, 0.9);
  --athena-panel-solid: #101723;
  --athena-ink: #f7fafc;
  --athena-text: #dbe4ee;
  --athena-muted: #91a0b4;
  --athena-soft: #5f6e82;
  --athena-line: rgba(176, 194, 217, 0.18);
  --athena-line-strong: rgba(72, 187, 255, 0.56);
  --athena-blue: #4f7cff;
  --athena-cyan: #25c8db;
  --athena-mint: #49d08f;
  --athena-danger: #fb7185;
  --athena-radius: 8px;
  --athena-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --athena-gradient: linear-gradient(135deg, var(--athena-blue), var(--athena-cyan) 58%, var(--athena-mint));
}

body.task-login,
body.task-login button,
body.task-login input,
body.task-login select,
body.task-login textarea {
  font-family: var(--athena-font) !important;
}

body.task-login {
  min-height: 100vh;
  overflow: auto;
  color: var(--athena-text);
  background:
    radial-gradient(circle at 18% 12%, rgba(79, 124, 255, 0.22), transparent 32rem),
    radial-gradient(circle at 82% 78%, rgba(37, 200, 219, 0.14), transparent 34rem),
    linear-gradient(135deg, #111827 0%, #091016 47%, #07100d 100%);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body.task-login::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.026) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.9), transparent 82%);
}

body.task-login::after {
  content: "";
  position: fixed;
  inset: auto 0 0;
  height: 34vh;
  pointer-events: none;
  background: linear-gradient(to top, rgba(7, 10, 15, 0.82), transparent);
}

body.task-login #layout {
  min-height: 100vh;
  height: auto;
  overflow: visible;
  background: transparent !important;
}

body.task-login #layout-content {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  margin: 0;
  padding: clamp(1.25rem, 4.8vh, 4rem);
  display: grid;
  place-items: center;
  background: transparent !important;
}

.af-mail-shell {
  box-sizing: border-box;
  width: min(100%, 940px);
  min-height: 560px;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
  overflow: hidden;
  border: 1px solid var(--athena-line);
  border-radius: var(--athena-radius);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
    rgba(9, 14, 22, 0.82);
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.024) inset;
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

.af-mail-identity {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  padding: clamp(1.5rem, 4vw, 3rem);
  border-right: 1px solid var(--athena-line);
  background:
    linear-gradient(145deg, rgba(79, 124, 255, 0.18), transparent 46%),
    linear-gradient(0deg, rgba(37, 200, 219, 0.1), transparent 48%);
}

.af-mail-identity::after {
  content: "";
  position: absolute;
  inset: auto 2rem 2rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.32), transparent);
  opacity: 0.7;
}

.af-brand-lockup {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  min-width: 0;
}

.af-brand-mark {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--athena-radius);
  background: rgba(4, 8, 13, 0.62);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.26);
}

body.task-login #logo,
.af-brand-mark img {
  position: static !important;
  display: block;
  width: 38px !important;
  height: 38px !important;
  max-width: 38px !important;
  max-height: 38px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: contain;
}

.af-brand-lockup strong {
  display: block;
  color: var(--athena-ink);
  font-size: 1.12rem;
  font-weight: 800;
  line-height: 1.1;
}

.af-brand-lockup span {
  display: block;
  margin-top: 0.28rem;
  color: var(--athena-muted);
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.35;
}

.af-mail-statement {
  position: relative;
  max-width: 28rem;
  margin: 3.5rem 0;
}

.af-mail-statement p {
  margin: 0;
  color: var(--athena-ink);
  font-size: clamp(2rem, 4.5vw, 3.35rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: 0;
}

.af-mail-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  max-width: 28rem;
}

.af-mail-signals span {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0 0.72rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--athena-radius);
  background: rgba(255, 255, 255, 0.055);
  color: #c8d5e4;
  font-size: 0.78rem;
  font-weight: 700;
}

.af-mail-auth {
  display: grid;
  align-items: center;
  padding: clamp(1.35rem, 4vw, 3rem);
  background: rgba(7, 11, 18, 0.34);
}

body.task-login #login-form {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  box-sizing: border-box;
  width: 100% !important;
  max-width: 390px !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible;
}

.af-form-heading {
  margin: 0 0 1.55rem;
}

.af-eyebrow,
.af-form-heading p {
  margin: 0;
  color: var(--athena-muted);
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.5;
}

.af-eyebrow {
  margin-bottom: 0.55rem !important;
  color: #7dd3fc !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
}

.af-form-heading h2 {
  margin: 0 0 0.38rem;
  color: var(--athena-ink);
  font-size: 1.65rem;
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: 0;
}

body.task-login #login-form table,
body.task-login #login-form tbody,
body.task-login #login-form tr,
body.task-login #login-form td {
  display: block !important;
  box-sizing: border-box;
  width: 100% !important;
}

body.task-login #login-form table {
  margin: 0 !important;
  border-spacing: 0 !important;
  border-collapse: collapse !important;
}

body.task-login #login-form tr.af-field {
  margin: 0 0 1rem !important;
}

body.task-login #login-form td.title {
  margin: 0 0 0.42rem !important;
  padding: 0 !important;
  text-align: left !important;
}

body.task-login #login-form td.input {
  position: relative;
  margin: 0 !important;
  padding: 0 !important;
}

body.task-login #login-form td.input::before,
body.task-login #login-form .input-group-prepend,
body.task-login #login-form .input-group-append,
body.task-login #login-form .input-group-text,
body.task-login #login-form .form-control::before,
body.task-login #rcmloginsubmit::before {
  display: none !important;
  content: none !important;
}

body.task-login #login-form label {
  color: var(--athena-text) !important;
  font-size: 0.82rem !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
}

body.task-login #login-form .form-control,
body.task-login #login-form input[type="text"],
body.task-login #login-form input[type="password"] {
  box-sizing: border-box;
  width: 100% !important;
  min-height: 3.25rem !important;
  padding: 0.88rem 0.95rem !important;
  border: 1px solid var(--athena-line) !important;
  border-radius: var(--athena-radius) !important;
  background: rgba(255, 255, 255, 0.055) !important;
  color: var(--athena-ink) !important;
  -webkit-text-fill-color: var(--athena-ink) !important;
  caret-color: var(--athena-cyan);
  font-size: 0.98rem !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.035) inset !important;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

body.task-login #login-form input::placeholder {
  color: var(--athena-soft) !important;
  opacity: 1 !important;
}

body.task-login #login-form input:focus {
  border-color: var(--athena-line-strong) !important;
  background: rgba(255, 255, 255, 0.082) !important;
  box-shadow: 0 0 0 3px rgba(37, 200, 219, 0.14) !important;
  outline: none !important;
}

body.task-login #login-form .formbuttons {
  margin: 1.25rem 0 0 !important;
}

body.task-login #rcmloginsubmit {
  width: 100% !important;
  min-height: 3.25rem !important;
  border: 0 !important;
  border-radius: var(--athena-radius) !important;
  background: var(--athena-gradient) !important;
  color: white !important;
  font-size: 0.92rem !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 0 16px 34px rgba(37, 200, 219, 0.22);
  transition: filter 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

body.task-login #rcmloginsubmit:hover,
body.task-login #rcmloginsubmit:focus-visible {
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow: 0 20px 42px rgba(79, 124, 255, 0.28);
  outline: none !important;
}

body.task-login #rcmloginsubmit:active {
  transform: translateY(0);
}

body.task-login #login-footer {
  margin-top: 1.15rem !important;
  color: var(--athena-muted) !important;
  font-size: 0.84rem !important;
  line-height: 1.5;
  text-align: center;
}

body.task-login a {
  color: #9fc5ff !important;
  text-decoration: none;
}

body.task-login a:hover {
  color: #7dd3fc !important;
  text-decoration: underline;
}

body.task-login #messagestack {
  position: fixed !important;
  right: 1rem !important;
  bottom: 1rem !important;
  z-index: 50 !important;
  width: min(25rem, calc(100vw - 2rem)) !important;
}

body.task-login #messagestack .notice,
body.task-login #messagestack .error,
body.task-login #messagestack .warning,
body.task-login #messagestack .confirmation {
  border: 1px solid rgba(251, 113, 133, 0.34) !important;
  border-radius: var(--athena-radius) !important;
  background: rgba(8, 12, 19, 0.96) !important;
  color: var(--athena-text) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.42) !important;
}

body.task-login .noscriptwarning {
  margin: 1rem auto 0;
  max-width: 30rem;
  color: var(--athena-muted);
  text-align: center;
}

body.task-login #layout-content > .header,
body.task-login #layout-menu,
.af-mail-hero,
.af-mail-code,
.af-mail-domains,
.af-mail-badge,
.af-mail-sub,
.af-mail-form-intro,
.af-mail-brand,
.af-mail-note {
  display: none !important;
}

@media (max-width: 820px) {
  body.task-login #layout-content {
    align-items: start;
    padding: 1rem;
  }

  .af-mail-shell {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .af-mail-identity {
    gap: 1.8rem;
    padding: 1.25rem;
    border-right: 0;
    border-bottom: 1px solid var(--athena-line);
  }

  .af-mail-identity::after,
  .af-mail-signals {
    display: none;
  }

  .af-mail-statement {
    margin: 0;
  }

  .af-mail-statement p {
    max-width: 18rem;
    font-size: 1.75rem;
  }

  .af-mail-auth {
    padding: 1.25rem;
  }

  body.task-login #login-form {
    max-width: none !important;
  }
}

@media (max-width: 460px) {
  body.task-login #layout-content {
    padding: 0.75rem;
  }

  .af-brand-mark {
    width: 46px;
    height: 46px;
  }

  .af-brand-lockup strong {
    font-size: 1.02rem;
  }

  .af-brand-lockup span,
  .af-form-heading p {
    font-size: 0.84rem;
  }

  .af-mail-statement p {
    font-size: 1.45rem;
  }

  .af-form-heading h2 {
    font-size: 1.4rem;
  }

  body.task-login #messagestack {
    right: 0.75rem !important;
    bottom: 0.75rem !important;
    width: calc(100vw - 1.5rem) !important;
  }
}
