.auth-page{
 min-height:100vh;
 min-height:100dvh;
 background:var(--app-bg);
 font-family:"Inter","Segoe UI",sans-serif;
 padding:0 0 max(1.25rem,env(safe-area-inset-bottom));
}
.auth-header{
 display:grid;
 grid-template-columns:44px 1fr 44px;
 align-items:center;
 padding:max(0.45rem,env(safe-area-inset-top)) 0.85rem 0.25rem;
}
.auth-back{
 width:40px;
 height:40px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 border-radius:12px;
 color:#1a1a1a;
 transition:background 0.2s ease;
}
.auth-back:hover{
 background:rgba(46,114,41,0.08);
 color:#1a1a1a;
}
.auth-back svg{
 width:22px;
 height:22px;
}
.auth-header-title{
 margin:0;
 text-align:center;
 font-size:0.82rem;
 font-weight:600;
 letter-spacing:0.04em;
 text-transform:uppercase;
 color:#5c665a;
}
.auth-header-title--subtle{
 position:absolute;
 width:1px;
 height:1px;
 padding:0;
 margin:-1px;
 overflow:hidden;
 clip:rect(0,0,0,0);
 white-space:nowrap;
 border:0;
}
.auth-hero{
 padding:0.35rem 1.25rem 0.75rem;
 max-width:440px;
 margin:0 auto;
 text-align:center;
}
.auth-hero h2{
 margin:0 0 0.35rem;
 font-size:clamp(1.5rem,5vw,1.75rem);
 font-weight:800;
 color:var(--brand-900,#1a5c18);
 line-height:1.15;
 letter-spacing:-0.025em;
}
.auth-hero p,
.auth-hero .auth-hero-note{
 margin:0 auto;
 max-width:22rem;
 font-size:0.95rem;
 font-weight:500;
 color:#1f291e;
 line-height:1.45;
}
.auth-shell{
 max-width:440px;
 margin:0 auto;
 padding:0 1rem 1rem;
}
.auth-card{
 background:#fff;
 border-radius:28px;
 box-shadow:0 12px 40px rgba(46,114,41,0.1);
 padding:1.65rem 1.5rem 1.5rem;
}
.auth-logo{
 display:flex;
 flex-direction:column;
 align-items:center;
 gap:0.55rem;
 margin-bottom:1.15rem;
}
.auth-logo-img{
 width:88px;
 height:88px;
 object-fit:contain;
 display:block;
}
.auth-logo span{
 font-family:"Libre Baskerville",Georgia,serif;
 font-size:0.95rem;
 font-weight:700;
 letter-spacing:0.04em;
 color:var(--brand-900);
}
.auth-lead{
 margin:0 0 1.25rem;
 text-align:center;
 font-size:0.88rem;
 line-height:1.55;
 color:#2f3a2f;
}
.auth-form{
 display:flex;
 flex-direction:column;
 gap:0.85rem;
}
.auth-field--float{
 position:relative;
}
.auth-field--float label{
 position:absolute;
 left:0.9rem;
 top:50%;
 transform:translateY(-50%);
 margin:0;
 font-size:0.95rem;
 font-weight:500;
 color:#9aa39a;
 pointer-events:none;
 transition:top 0.18s ease,transform 0.18s ease,font-size 0.18s ease,color 0.18s ease;
 transform-origin:left center;
 max-width:calc(100% - 1.8rem);
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis;
}
.auth-field--float textarea+label{
 top:1rem;
 transform:none;
}
.auth-field--float:focus-within label,
.auth-field--float.is-filled label,
.auth-field--float:has(input:autofill) label,
.auth-field--float:has(input:-webkit-autofill) label,
.auth-field--float:has(textarea:autofill) label,
.auth-field--float:has(textarea:-webkit-autofill) label{
 top:0;
 transform:translateY(-50%);
 font-size:0.72rem;
 font-weight:600;
 background:#fff;
 padding:0 0.3rem;
 max-width:calc(100% - 1.2rem);
}
.auth-field--float:focus-within label{
 color:var(--button-color);
}
.auth-field--float.is-filled:not(:focus-within) label,
.auth-field--float:has(input:autofill):not(:focus-within) label,
.auth-field--float:has(input:-webkit-autofill):not(:focus-within) label{
 color:#7a8278;
}
.auth-field--float textarea:focus+label,
.auth-field--float.is-filled textarea+label,
.auth-field--float:has(textarea:autofill) textarea+label,
.auth-field--float:has(textarea:-webkit-autofill) textarea+label{
 top:0;
 transform:translateY(-50%);
}
.auth-field input,
.auth-field textarea{
 width:100%;
 border:1.5px solid #d8dfd0;
 border-radius:10px;
 background:#fff;
 padding:0.82rem 0.95rem;
 font-size:0.95rem;
 color:#1f1f1f;
 transition:border-color 0.2s ease,box-shadow 0.2s ease;
}
.auth-field--float input,
.auth-field--float textarea{
 padding:1.15rem 0.95rem 0.55rem;
}
@keyframes auth-autofill-on{
 from{opacity:0.99;}
 to{opacity:1;}
}
@keyframes auth-autofill-off{
 from{opacity:1;}
 to{opacity:0.99;}
}
.auth-field input:-webkit-autofill,
.auth-field input:-webkit-autofill:hover,
.auth-field input:-webkit-autofill:focus,
.auth-field textarea:-webkit-autofill,
.auth-field textarea:-webkit-autofill:hover,
.auth-field textarea:-webkit-autofill:focus{
 -webkit-text-fill-color:#1f1f1f;
 caret-color:#1f1f1f;
 box-shadow:0 0 0 1000px #fff inset;
 transition:background-color 99999s ease-out;
 animation-name:auth-autofill-on;
 animation-duration:0.001s;
}
.auth-field input:not(:-webkit-autofill),
.auth-field textarea:not(:-webkit-autofill){
 animation-name:auth-autofill-off;
 animation-duration:0.001s;
}
.auth-field--float textarea{
 min-height:96px;
 padding-top:1.35rem;
}
.auth-field input::placeholder,
.auth-field textarea::placeholder{
 color:transparent;
}
.auth-field input:focus,
.auth-field textarea:focus{
 outline:none;
 border-color:var(--button-color);
 box-shadow:0 0 0 3px rgba(0,171,102,0.12);
}
.auth-field textarea{
 min-height:88px;
 resize:vertical;
}
.auth-password-wrap{
 position:relative;
}
.auth-password-wrap input{
 padding-right:3rem;
}
.auth-password-wrap.auth-field--float input{
 padding-right:3rem;
}
.auth-password-toggle{
 position:absolute;
 top:50%;
 right:0.65rem;
 transform:translateY(-50%);
 width:36px;
 height:36px;
 border:0;
 background:transparent;
 color:#8a8a8a;
 border-radius:8px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 cursor:pointer;
}
.auth-password-toggle:hover{
 color:var(--brand-900);
 background:rgba(46,114,41,0.06);
}
.auth-password-toggle svg{
 width:20px;
 height:20px;
}
.auth-btn-primary{
 width:100%;
 border:0;
 border-radius:12px;
 background:var(--button-color);
 color:#fff;
 font-size:1rem;
 font-weight:700;
 padding:0.9rem 1rem;
 margin-top:0.35rem;
 box-shadow:0 8px 20px rgba(0,171,102,0.28);
 transition:transform 0.15s ease,box-shadow 0.15s ease,background 0.15s ease;
}
.auth-btn-primary:hover:not(:disabled){
 background:#009558;
 transform:translateY(-1px);
 box-shadow:0 10px 24px rgba(0,171,102,0.32);
}
.auth-btn-primary:disabled{
 opacity:0.75;
 cursor:not-allowed;
}
.auth-btn-row{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:0.75rem;
 margin-top:0.85rem;
}
.auth-btn-secondary{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 min-height:46px;
 border:1.5px solid #d8dfd0;
 border-radius:12px;
 background:#fff;
 color:var(--brand-900);
 font-size:0.9rem;
 font-weight:700;
 text-align:center;
 transition:border-color 0.2s ease,background 0.2s ease;
}
.auth-btn-secondary:hover{
 border-color:var(--button-color);
 background:rgba(0,171,102,0.04);
 color:var(--brand-900);
}
.auth-otp-wrap{
 display:flex;
 justify-content:center;
 gap:0.75rem;
 margin:0.35rem 0 0.15rem;
}
.auth-otp-digit{
 width:58px;
 height:58px;
 border:0;
 border-radius:10px;
 background:var(--button-color);
 color:#fff;
 font-size:1.35rem;
 font-weight:700;
 text-align:center;
 caret-color:#fff;
 box-shadow:0 6px 16px rgba(0,171,102,0.22);
 transition:transform 0.15s ease,opacity 0.15s ease;
}
.auth-otp-digit::placeholder{
 color:rgba(255,255,255,0.35);
}
.auth-otp-digit:focus{
 outline:none;
 transform:scale(1.04);
 box-shadow:0 8px 20px rgba(0,171,102,0.3);
}
.auth-otp-digit:not(:placeholder-shown),
.auth-otp-digit.filled{
 background:var(--button-color);
}
.auth-otp-digit:placeholder-shown:not(:focus){
 opacity:0.72;
}
.auth-mobile-display{
 font-weight:600;
 color:#1f1f1f;
}
@media (min-width:480px){
 .auth-page{
 display:flex;
 flex-direction:column;
 justify-content:center;
}
 .auth-header{
 padding-top:1rem;
}
}