/* iBlogger Auth Compact Pass — reduce vertical scrolling while preserving functionality */

@media (min-width: 681px){
  .auth-page.auth-next .authn-form-pane{
    padding:12px clamp(18px,2.3vw,34px) 12px;
  }
  .auth-page.auth-next .authn-topbar{
    min-height:50px;
    padding:6px 9px 6px 12px;
    border-radius:17px;
  }
  .auth-page.auth-next .authn-brand .site-logo-image{
    height:34px;
    max-width:132px;
  }
  .auth-page.auth-next .authn-back,
  .auth-page.auth-next .authn-theme{
    min-height:36px;
    border-radius:11px;
  }
  .auth-page.auth-next .authn-back{
    padding:6px 10px;
    font-size:.72rem;
  }
  .auth-page.auth-next .authn-theme{
    width:36px;
  }
  .auth-page.auth-next .authn-theme svg{
    width:17px;
    height:17px;
  }

  .auth-page.auth-next .authn-form-wrap,
  .auth-page.auth-next .authn-signup-wrap{
    padding:12px 0 5px;
  }
  .auth-page.auth-next .authn-heading{
    margin-bottom:12px;
  }
  .auth-page.auth-next .authn-eyebrow{
    margin-bottom:7px;
    padding:4px 9px;
    gap:6px;
    font-size:.66rem;
  }
  .auth-page.auth-next .authn-eyebrow i{
    width:6px;
    height:6px;
  }
  .auth-page.auth-next .authn-heading h1{
    margin-bottom:6px;
    font-size:clamp(1.75rem,2.55vw,2.65rem);
    line-height:1;
  }
  .auth-page.auth-next .authn-heading p{
    font-size:.78rem;
    line-height:1.6;
    max-width:58ch;
  }

  .auth-page.auth-next .authn-form{
    gap:10px;
    padding:15px;
    border-radius:21px;
    box-shadow:0 18px 48px rgba(25,31,84,.10);
  }
  .auth-page.auth-next .authn-field{
    gap:4px;
  }
  .auth-page.auth-next .authn-field>label,
  .auth-page.auth-next .authn-label-row label{
    font-size:.72rem;
  }
  .auth-page.auth-next .authn-input{
    min-height:44px;
    gap:8px;
    padding-inline:12px 6px;
    border-radius:13px;
  }
  .auth-page.auth-next .authn-input .auth-input-icon{
    width:18px;
    height:18px;
  }
  .auth-page.auth-next .authn-input input{
    height:40px;
    font-size:.82rem;
  }
  .auth-page.auth-next .authn-password-toggle{
    width:34px;
    height:34px;
    border-radius:9px;
  }
  .auth-page.auth-next .authn-password-toggle svg{
    width:17px;
    height:17px;
  }
  .auth-page.auth-next .auth-error{
    min-height:10px;
    font-size:.61rem;
    line-height:1.2;
  }
  .auth-page.auth-next .authn-remember,
  .auth-page.auth-next .authn-terms{
    font-size:.68rem;
    line-height:1.45;
  }
  .auth-page.auth-next .authn-remember input,
  .auth-page.auth-next .authn-terms input{
    width:15px;
    height:15px;
    margin-top:1px;
  }
  .auth-page.auth-next .authn-submit{
    min-height:44px;
    border-radius:13px;
    font-size:.8rem;
    box-shadow:0 12px 22px rgba(76,92,223,.18);
  }
  .auth-page.auth-next .authn-google{
    min-height:43px;
    border-radius:13px;
    font-size:.76rem;
  }
  .auth-page.auth-next .authn-google svg{
    width:18px;
    height:18px;
  }
  .auth-page.auth-next .authn-divider{
    gap:8px;
    font-size:.6rem;
  }
  .auth-page.auth-next .authn-switch{
    margin-top:9px;
    font-size:.7rem;
  }
  .auth-page.auth-next .authn-security{
    margin-top:7px;
    max-width:560px;
    font-size:.58rem;
    line-height:1.45;
  }
  .auth-page.auth-next .authn-security svg{
    width:13px;
    height:13px;
  }

  /* Signup: use the available desktop width instead of stacking every section vertically. */
  .auth-page.auth-next.signup-page .authn-signup-wrap{
    width:min(100%,820px);
    padding-top:8px;
  }
  .auth-page.auth-next.signup-page .authn-register-form{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:12px;
    row-gap:9px;
    padding:13px;
  }
  .auth-page.auth-next.signup-page .authn-register-form > .authn-field:first-child{
    grid-column:1 / -1;
  }
  .auth-page.auth-next.signup-page .authn-register-form > .authn-form-section{
    min-width:0;
    align-content:start;
  }
  .auth-page.auth-next.signup-page .authn-register-form > .authn-terms-wrap{
    grid-column:1 / -1;
  }
  .auth-page.auth-next.signup-page .authn-register-form > .authn-submit{
    grid-column:1;
  }
  .auth-page.auth-next.signup-page .authn-register-form > .authn-divider{
    display:none;
  }
  .auth-page.auth-next.signup-page .authn-register-form > .authn-google{
    grid-column:2;
  }
  .auth-page.auth-next.signup-page .authn-form-section{
    gap:8px;
    padding-top:0;
  }
  .auth-page.auth-next.signup-page .authn-section-label{
    gap:7px;
  }
  .auth-page.auth-next.signup-page .authn-section-label>span{
    width:24px;
    height:24px;
    border-radius:8px;
    font-size:.58rem;
  }
  .auth-page.auth-next.signup-page .authn-section-label strong{
    font-size:.7rem;
  }
  .auth-page.auth-next.signup-page .authn-section-label small{
    margin-top:0;
    font-size:.56rem;
    line-height:1.35;
  }
  .auth-page.auth-next.signup-page .authn-role-selector{
    gap:8px;
  }
  .auth-page.auth-next.signup-page .authn-role-card{
    min-height:78px;
    gap:3px;
    padding:9px 10px;
    border-radius:14px;
  }
  .auth-page.auth-next.signup-page .authn-role-icon{
    width:28px;
    height:28px;
    border-radius:9px;
  }
  .auth-page.auth-next.signup-page .authn-role-icon svg{
    width:16px;
    height:16px;
  }
  .auth-page.auth-next.signup-page .authn-role-card>strong{
    font-size:.7rem;
  }
  .auth-page.auth-next.signup-page .authn-role-card>small{
    font-size:.55rem;
    line-height:1.3;
  }
  .auth-page.auth-next.signup-page .authn-role-card>i{
    top:9px;
    left:9px;
    width:12px;
    height:12px;
  }
  .auth-page.auth-next.signup-page .authn-row{
    gap:8px;
  }
  .auth-page.auth-next.signup-page .authn-strength{
    gap:4px;
    margin-top:0;
  }
  .auth-page.auth-next.signup-page .strength-bars{
    gap:4px;
  }
  .auth-page.auth-next.signup-page .strength-bars span{
    height:3px;
  }
  .auth-page.auth-next.signup-page .strength-copy{
    font-size:.56rem;
  }
  .auth-page.auth-next.signup-page .authn-terms-wrap{
    gap:0;
    padding:8px 10px;
    border-radius:12px;
  }

  /* Keep the visual half within the viewport so it never creates extra document height. */
  .auth-page.auth-next .authn-visual{
    min-height:100vh;
    height:100vh;
    padding:clamp(20px,2.5vw,32px);
    overflow:hidden;
  }
  .auth-page.auth-next .authn-visual-kicker{
    margin-bottom:12px;
    padding:6px 10px;
    font-size:.62rem;
  }
  .auth-page.auth-next .authn-visual h2{
    margin-bottom:8px;
    font-size:clamp(2rem,3.65vw,3.65rem);
    line-height:1.02;
  }
  .auth-page.auth-next .authn-visual-inner>p{
    font-size:.75rem;
    line-height:1.6;
  }
  .auth-page.auth-next .authn-collage{
    height:min(30vh,235px);
    margin:14px 0 12px;
  }
  .auth-page.auth-next .authn-photo-a{
    width:118px;
    height:176px;
    top:24px;
  }
  .auth-page.auth-next .authn-photo-b{
    width:142px;
    height:210px;
    top:4px;
  }
  .auth-page.auth-next .authn-photo-c{
    width:108px;
    height:162px;
    top:34px;
  }
  .auth-page.auth-next .authn-float-card{
    min-width:138px;
    padding:8px 10px;
    border-radius:12px;
  }
  .auth-page.auth-next .authn-float-card span{
    font-size:.52rem;
  }
  .auth-page.auth-next .authn-float-card strong{
    font-size:.64rem;
  }
  .auth-page.auth-next .authn-points{
    gap:7px;
  }
  .auth-page.auth-next .authn-points span{
    gap:6px;
    padding:8px 9px;
    border-radius:11px;
    font-size:.54rem;
  }
}

/* Extra compression for common 720–800px laptop heights. */
@media (min-width:981px) and (max-height:800px){
  .auth-page.auth-next .authn-form-pane{
    padding-top:8px;
    padding-bottom:8px;
  }
  .auth-page.auth-next .authn-topbar{
    min-height:46px;
  }
  .auth-page.auth-next .authn-brand .site-logo-image{
    height:31px;
  }
  .auth-page.auth-next .authn-form-wrap,
  .auth-page.auth-next .authn-signup-wrap{
    padding-top:7px;
  }
  .auth-page.auth-next .authn-heading{
    margin-bottom:8px;
  }
  .auth-page.auth-next .authn-heading h1{
    font-size:clamp(1.55rem,2.15vw,2.2rem);
    margin-bottom:4px;
  }
  .auth-page.auth-next .authn-heading p{
    font-size:.7rem;
    line-height:1.45;
  }
  .auth-page.auth-next .authn-eyebrow{
    margin-bottom:5px;
    padding:3px 8px;
    font-size:.59rem;
  }
  .auth-page.auth-next .authn-form{
    padding:11px;
    gap:7px;
  }
  .auth-page.auth-next .authn-input{
    min-height:40px;
  }
  .auth-page.auth-next .authn-input input{
    height:36px;
  }
  .auth-page.auth-next .auth-error{
    min-height:8px;
    font-size:.56rem;
  }
  .auth-page.auth-next .authn-submit,
  .auth-page.auth-next .authn-google{
    min-height:40px;
  }
  .auth-page.auth-next .authn-switch{
    margin-top:6px;
  }
  .auth-page.auth-next .authn-security{
    margin-top:4px;
  }
  .auth-page.auth-next.signup-page .authn-register-form{
    padding:10px;
    row-gap:6px;
  }
  .auth-page.auth-next.signup-page .authn-role-card{
    min-height:68px;
    padding:7px 9px;
  }
  .auth-page.auth-next.signup-page .authn-form-section{
    gap:6px;
  }
  .auth-page.auth-next.signup-page .authn-terms-wrap{
    padding:6px 9px;
  }
  .auth-page.auth-next .authn-collage{
    height:190px;
    margin:10px 0 9px;
  }
  .auth-page.auth-next .authn-photo-a{width:104px;height:154px;top:20px;}
  .auth-page.auth-next .authn-photo-b{width:126px;height:184px;top:2px;}
  .auth-page.auth-next .authn-photo-c{width:96px;height:145px;top:29px;}
  .auth-page.auth-next .authn-points span{
    padding:6px 7px;
    font-size:.5rem;
  }
}

/* Compact responsive mode: keep role selection horizontal and reduce stacked height. */
@media (max-width:680px){
  .auth-page.auth-next .authn-form-pane{
    padding:8px 9px 12px;
  }
  .auth-page.auth-next .authn-topbar{
    min-height:50px;
    padding:6px 7px;
  }
  .auth-page.auth-next .authn-form-wrap,
  .auth-page.auth-next .authn-signup-wrap{
    padding:16px 2px 7px;
  }
  .auth-page.auth-next .authn-heading{
    margin-bottom:12px;
  }
  .auth-page.auth-next .authn-eyebrow{
    margin-bottom:7px;
    padding:4px 8px;
    font-size:.62rem;
  }
  .auth-page.auth-next .authn-heading h1{
    margin-bottom:6px;
    font-size:1.75rem;
    line-height:1.04;
  }
  .auth-page.auth-next .authn-heading p{
    font-size:.76rem;
    line-height:1.65;
  }
  .auth-page.auth-next .authn-form{
    padding:13px;
    gap:11px;
    border-radius:18px;
  }
  .auth-page.auth-next .authn-field{
    gap:4px;
  }
  .auth-page.auth-next .authn-input{
    min-height:46px;
  }
  .auth-page.auth-next .authn-input input{
    height:42px;
  }
  .auth-page.auth-next .auth-error{
    min-height:9px;
    font-size:.59rem;
  }
  .auth-page.auth-next .authn-submit,
  .auth-page.auth-next .authn-google{
    min-height:46px;
  }
  .auth-page.auth-next .authn-switch{
    margin-top:10px;
  }
  .auth-page.auth-next .authn-security{
    margin-top:7px;
  }

  .auth-page.auth-next.signup-page .authn-register-form{
    gap:9px;
  }
  .auth-page.auth-next.signup-page .authn-form-section{
    gap:8px;
  }
  .auth-page.auth-next.signup-page .authn-section-label{
    gap:7px;
  }
  .auth-page.auth-next.signup-page .authn-section-label>span{
    width:25px;
    height:25px;
    font-size:.58rem;
  }
  .auth-page.auth-next.signup-page .authn-section-label strong{
    font-size:.7rem;
  }
  .auth-page.auth-next.signup-page .authn-section-label small{
    display:none;
  }
  .auth-page.auth-next.signup-page .authn-role-selector{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
  }
  .auth-page.auth-next.signup-page .authn-role-card{
    min-height:82px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    padding:8px 4px;
    text-align:center;
    border-radius:14px;
  }
  .auth-page.auth-next.signup-page .authn-role-icon{
    width:28px;
    height:28px;
    grid-row:auto;
  }
  .auth-page.auth-next.signup-page .authn-role-card>strong{
    font-size:.66rem;
    align-self:auto;
  }
  .auth-page.auth-next.signup-page .authn-role-card>small{
    display:none;
  }
  .auth-page.auth-next.signup-page .authn-role-card>i{
    position:absolute;
    top:7px;
    left:7px;
    width:11px;
    height:11px;
  }
  .auth-page.auth-next.signup-page .authn-row{
    gap:8px;
  }
  .auth-page.auth-next.signup-page .authn-strength{
    margin-top:0;
  }
  .auth-page.auth-next.signup-page .authn-terms-wrap{
    padding:8px 9px;
  }
}

@media (min-width:350px) and (max-width:680px){
  /* On typical phones, pair related signup fields side-by-side to avoid needless vertical stacking. */
  .auth-page.auth-next.signup-page .authn-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }
  .auth-page.auth-next.signup-page .authn-input{
    padding-inline:8px 4px;
    gap:5px;
  }
  .auth-page.auth-next.signup-page .authn-input .auth-input-icon{
    width:16px;
    height:16px;
  }
  .auth-page.auth-next.signup-page .authn-input input{
    font-size:.73rem;
  }
  .auth-page.auth-next.signup-page .authn-password-toggle{
    width:30px;
    height:30px;
  }
  .auth-page.auth-next.signup-page .authn-password-toggle svg{
    width:15px;
    height:15px;
  }
  .auth-page.auth-next.signup-page .authn-field>label{
    font-size:.66rem;
  }
}


/* Auth final alignment + brand color fix.
   - Keep password + confirmation controls aligned from the same top baseline.
   - Force the auth logo to the same neutral black treatment requested for the main-site brand. */
.auth-page.auth-next.signup-page .authn-password-row{
  align-items:start!important;
}
.auth-page.auth-next.signup-page .authn-password-row > .authn-field{
  align-self:start!important;
  align-content:start!important;
}
.auth-page.auth-next .authn-brand .logo-light{
  display:block!important;
  filter:brightness(0)!important;
  opacity:1!important;
}
.auth-page.auth-next .authn-brand .logo-dark{
  display:none!important;
}
html[data-theme="dark"] body.auth-page.auth-next .authn-brand .logo-light{
  display:block!important;
  filter:brightness(0) invert(1)!important;
}
html[data-theme="dark"] body.auth-page.auth-next .authn-brand .logo-dark{
  display:none!important;
}
