@layer m1-auth {
  .auth-page main {
    display: grid;
    min-height: calc(100vh - 76px);
    place-items: start center;
    padding: clamp(3rem, 7vw, 6rem) 24px;
    background: var(--m1-canvas);
  }

  .auth-split {
    display: grid;
    width: min(100%, 1080px);
    grid-template-columns: minmax(350px, .88fr) minmax(0, 1.12fr);
    overflow: hidden;
    border: 1px solid var(--m1-border);
    border-radius: var(--m1-radius-lg);
    background: var(--m1-surface);
    box-shadow: 0 28px 72px rgba(9, 17, 31, .10);
  }

  .auth-brand-pane {
    min-height: 100%;
    padding: clamp(2.35rem, 4vw, 3.5rem);
    background: #0b1320;
    color: #fff;
  }
  .auth-brand-pane__content { display: flex; min-height: 100%; flex-direction: column; justify-content: center; }
  .auth-brand-pane__logo { display: inline-flex; align-self: flex-start; margin-bottom: 2.4rem; }
  .auth-brand-pane__logo img { width: 104px; height: auto; filter: invert(1); }
  .auth-brand-pane h2 {
    max-width: 14ch;
    margin-bottom: 1.75rem;
    color: #fffdf8;
    font-size: clamp(1.8rem, 3vw, 2.5rem);
    font-weight: 540;
    letter-spacing: -.04em;
    line-height: 1.08;
  }
  .auth-brand-pane__list { display: grid; gap: .95rem; margin: 0; padding: 0; list-style: none; }
  .auth-brand-pane__list li { position: relative; padding-left: 1.15rem; color: #aab3c0; font-size: .84rem; line-height: 1.55; }
  .auth-brand-pane__list li::before { position: absolute; top: .55rem; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #8ea8c3; content: ""; }
  .auth-brand-pane__visual { margin: 2.6rem 0 0; }
  .auth-brand-pane__visual img {
    width: 100%;
    aspect-ratio: 16 / 7;
    object-fit: cover;
    border: 1px solid rgba(142,168,195,.18);
    border-radius: 10px;
    background: #07101d;
  }
  .auth-brand-pane__visual figcaption { margin-top: .7rem; color: #717d8d; font-size: .65rem; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }

  .auth-form-pane, .auth-shell { min-width: 0; }
  .auth-form-pane { display: block; padding: 0; background: #fff; }
  .auth-shell { display: grid; width: auto; min-height: 100%; place-items: center; margin: 0; padding: clamp(2.25rem, 5vw, 4.25rem); }
  .auth-card { width: min(100%, 520px); padding: 0; border: 0; background: transparent; box-shadow: none; }
  .auth-header { margin-bottom: 2rem; }
  .auth-header .page-eyebrow, .auth-card > .page-eyebrow { display: block; margin-bottom: .6rem; color: var(--m1-business-accent-strong); font-size: .72rem; font-weight: 720; letter-spacing: .13em; text-transform: uppercase; }
  .auth-header h1, .auth-card > h1 { margin-bottom: .7rem; font-size: clamp(2.15rem, 4vw, 3rem); font-weight: 590; letter-spacing: -.045em; }
  .auth-header p, .auth-card > p { margin-bottom: 0; color: var(--m1-ink-muted); line-height: 1.7; }
  .auth-header a { font-weight: 680; }
  .auth-form { display: grid; gap: 1.5rem; }
  .form-stack { display: grid; gap: 1.15rem; }
  .form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; }
  .form-group { display: grid; min-width: 0; gap: .48rem; }
  .form-help { color: var(--m1-ink-muted); font-size: .76rem; line-height: 1.5; }
  .auth-actions { display: grid; gap: .85rem; padding-top: .6rem; }
  .auth-actions .btn-block { min-height: 50px; }
  .btn-block { width: 100%; }
  .auth-link-row { margin: 0; color: var(--m1-ink-muted); font-size: .82rem; line-height: 1.5; text-align: center; }
  .auth-link-row a { color: var(--m1-ink); font-weight: 680; }
  .auth-centered { text-align: center; }
  .auth-success-icon, .status-icon { display: grid; width: 58px; height: 58px; place-items: center; margin: 0 auto 1.35rem; border: 1px solid #acd4c3; border-radius: 50%; background: var(--m1-success-soft); color: var(--m1-success); }
  .auth-success-icon svg, .status-icon svg { width: 24px; height: 24px; }
  .status-icon--error { border-color: #e6b9b9; background: var(--m1-danger-soft); color: var(--m1-danger); }
  .auth-card .alert { margin-bottom: 1.2rem; text-align: left; }

  @media (max-width: 840px) {
    .auth-split { grid-template-columns: minmax(285px, .7fr) minmax(0, 1.3fr); }
    .auth-brand-pane { padding: 2.2rem; }
    .auth-brand-pane__visual { margin-top: 2rem; }
  }

  @media (max-width: 760px) {
    .auth-page main { min-height: calc(100vh - 66px); padding: 1.5rem 14px 3rem; }
    .auth-split { grid-template-columns: 1fr; border-radius: var(--m1-radius-md); box-shadow: 0 18px 48px rgba(9, 17, 31, .08); }
    .auth-brand-pane { display: none; }
    .auth-shell { padding: 2rem 1.25rem; }
    .form-row { grid-template-columns: 1fr; }
  }
}
