:root{
    --auth-green:#176d36;
    --auth-green-dark:#0f4f28;
    --auth-green-soft:#eaf5ed;
    --auth-cream:#f5f2e8;
    --auth-cream-2:#fbfaf6;
    --auth-border:#dfe4de;
    --auth-text:#243129;
    --auth-muted:#748078;
    --auth-red:#b42318;
    --auth-red-soft:#fff0ee;
    --auth-amber:#a76400;
    --auth-amber-soft:#fff6dc;
    --auth-shadow:0 28px 80px rgba(26,55,35,.12);
}

.auth-body{
    min-height:100vh;
    margin:0;
    overflow-x:hidden;
    color:var(--auth-text);
    background:
        radial-gradient(circle at 12% 15%,rgba(229,196,104,.18),transparent 26%),
        radial-gradient(circle at 92% 88%,rgba(23,109,54,.12),transparent 27%),
        linear-gradient(135deg,#f8f6ee 0%,#f2f5ef 54%,#eef5ef 100%);
}

.auth-decoration{
    position:fixed;
    z-index:0;
    border-radius:999px;
    pointer-events:none;
    filter:blur(1px);
}

.auth-decoration-one{
    width:320px;
    height:320px;
    top:-135px;
    right:-90px;
    border:1px solid rgba(23,109,54,.13);
    box-shadow:inset 0 0 0 42px rgba(23,109,54,.025),inset 0 0 0 84px rgba(23,109,54,.018);
}

.auth-decoration-two{
    width:210px;
    height:210px;
    left:-84px;
    bottom:-70px;
    border:1px solid rgba(167,100,0,.12);
    box-shadow:inset 0 0 0 34px rgba(167,100,0,.025);
}

.auth-home-link{
    position:fixed;
    z-index:5;
    top:24px;
    left:28px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#56635a;
    font-size:12px;
    font-weight:600;
    text-decoration:none;
    padding:9px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.72);
    border:1px solid rgba(23,55,35,.08);
    backdrop-filter:blur(12px);
    transition:.18s ease;
}

.auth-home-link:hover{
    color:var(--auth-green);
    border-color:rgba(23,109,54,.24);
    transform:translateX(-2px);
}

.auth-shell{
    position:relative;
    z-index:2;
    width:min(980px,calc(100% - 40px));
    min-height:620px;
    margin:70px auto 42px;
    display:grid;
    grid-template-columns:minmax(300px,.88fr) minmax(420px,1.12fr);
    border:1px solid rgba(45,71,53,.12);
    border-radius:28px;
    overflow:hidden;
    background:rgba(255,255,255,.94);
    box-shadow:var(--auth-shadow);
}

.auth-showcase{
    position:relative;
    display:flex;
    flex-direction:column;
    min-height:100%;
    padding:42px 40px 34px;
    color:#fff;
    background:
        linear-gradient(155deg,rgba(255,255,255,.055),transparent 38%),
        linear-gradient(145deg,#0d4726 0%,#176d36 62%,#1b7a3c 100%);
    overflow:hidden;
}

.auth-showcase::before,
.auth-showcase::after{
    content:"";
    position:absolute;
    border-radius:999px;
    pointer-events:none;
}

.auth-showcase::before{
    width:260px;
    height:260px;
    right:-145px;
    top:110px;
    border:1px solid rgba(255,255,255,.12);
    box-shadow:inset 0 0 0 38px rgba(255,255,255,.025),inset 0 0 0 76px rgba(255,255,255,.018);
}

.auth-showcase::after{
    width:140px;
    height:140px;
    left:-82px;
    bottom:92px;
    background:rgba(233,199,99,.08);
}


.auth-showcase-copy{
    position:relative;
    z-index:1;
    margin-top:74px;
}

.auth-eyebrow{
    display:block;
    margin-bottom:12px;
    color:#d6e8db;
    font-size:10px;
    line-height:1;
    font-weight:700;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.auth-showcase-copy h1{
    max-width:330px;
    margin:0;
    font-family:'Lora',serif;
    font-size:31px;
    line-height:1.25;
    font-weight:600;
    letter-spacing:-.02em;
}

.auth-showcase-copy p{
    max-width:320px;
    margin:15px 0 0;
    color:rgba(255,255,255,.7);
    font-size:13px;
    line-height:1.7;
}

.auth-benefits{
    position:relative;
    z-index:1;
    display:grid;
    gap:15px;
    margin-top:36px;
}

.auth-benefit{
    display:grid;
    grid-template-columns:34px 1fr;
    gap:11px;
    align-items:start;
}

.auth-benefit>span{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:10px;
    color:#f4d57a;
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.11);
    font-size:16px;
}

.auth-benefit strong{
    display:block;
    margin-top:1px;
    color:#fff;
    font-size:12px;
    font-weight:600;
}

.auth-benefit small{
    display:block;
    margin-top:3px;
    color:rgba(255,255,255,.58);
    font-size:10px;
    line-height:1.55;
}

.auth-showcase-foot{
    position:relative;
    z-index:1;
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:auto;
    padding-top:28px;
    color:rgba(255,255,255,.5);
    font-size:9px;
    line-height:1.55;
}

.auth-showcase-foot i{
    margin-top:1px;
    font-size:13px;
    color:rgba(255,255,255,.66);
}

.auth-panel{
    min-width:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:38px 58px 42px;
    overflow-y:auto;
    background:rgba(255,255,255,.97);
}

.auth-panel-inner{
    width:100%;
    max-width:440px;
    margin:auto;
}

.auth-panel-brand{
    display:flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    max-width:100%;
    margin:0 auto 26px;
    text-decoration:none;
}

.auth-panel-brand img{
    display:block;
    width:auto;
    height:auto;
    max-width:min(120px,82vw);
    max-height:120px;
    object-fit:contain;
}

.auth-register-page .auth-shell{
    margin-top:38px;
    margin-bottom:38px;
}

.auth-register-page .auth-panel{
    justify-content:flex-start;
    padding-top:30px;
    padding-bottom:34px;
}

.auth-register-page .auth-panel-inner{
    margin:0 auto;
}

.auth-form-head{
    display:grid;
    grid-template-columns:48px 1fr;
    gap:14px;
    align-items:center;
    margin-bottom:25px;
}

.auth-form-icon{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:15px;
    color:var(--auth-green);
    background:var(--auth-green-soft);
    border:1px solid rgba(23,109,54,.11);
    font-size:22px;
}

.auth-form-icon.is-amber{
    color:var(--auth-amber);
    background:var(--auth-amber-soft);
    border-color:rgba(167,100,0,.12);
}

.auth-form-head h2,
.auth-verify-hero h2{
    margin:0;
    color:var(--auth-text);
    font-family:'Lora',serif;
    font-size:25px;
    line-height:1.25;
    font-weight:600;
    letter-spacing:-.015em;
}

.auth-form-head p{
    margin:5px 0 0;
    color:var(--auth-muted);
    font-size:11px;
    line-height:1.55;
}

.auth-notice{
    display:grid;
    grid-template-columns:32px 1fr;
    gap:10px;
    align-items:start;
    margin-bottom:19px;
    padding:12px 13px;
    border-radius:12px;
    border:1px solid transparent;
}

.auth-notice>span{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border-radius:9px;
    font-size:17px;
}

.auth-notice strong{
    display:block;
    margin-top:1px;
    font-size:11px;
    line-height:1.3;
}

.auth-notice p{
    margin:3px 0 0;
    font-size:10px;
    line-height:1.55;
}

.auth-notice.is-error{
    color:var(--auth-red);
    background:var(--auth-red-soft);
    border-color:rgba(180,35,24,.13);
}

.auth-notice.is-error>span{
    background:rgba(180,35,24,.08);
}

.auth-notice.is-success{
    color:#176533;
    background:#edf8ef;
    border-color:rgba(23,101,51,.13);
}

.auth-notice.is-success>span{
    background:rgba(23,101,51,.08);
}

.auth-form{
    display:block;
}

.auth-field{
    margin-bottom:15px;
}

.auth-field label{
    display:block;
    margin-bottom:7px;
    color:#46524a;
    font-size:10px;
    line-height:1;
    font-weight:700;
    letter-spacing:.055em;
    text-transform:uppercase;
}

.auth-control{
    position:relative;
    display:flex;
    align-items:center;
    min-height:46px;
    border:1px solid var(--auth-border);
    border-radius:12px;
    background:#fff;
    box-shadow:0 1px 2px rgba(28,50,35,.025);
    transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}

.auth-control:focus-within{
    border-color:rgba(23,109,54,.7);
    box-shadow:0 0 0 4px rgba(23,109,54,.08);
}

.auth-control>i{
    width:42px;
    flex:0 0 auto;
    text-align:center;
    color:#8b958f;
    font-size:17px;
}

.auth-control input{
    width:100%;
    min-width:0;
    height:44px;
    padding:0 13px 0 0;
    border:0;
    outline:0;
    background:transparent;
    color:var(--auth-text);
    font-family:'Inter',sans-serif;
    font-size:12px;
}

.auth-control input::placeholder{
    color:#a8b0aa;
}

.auth-control.is-readonly{
    background:#f6f7f5;
}

.auth-control.is-readonly input{
    color:#737d76;
}

.auth-field.has-error .auth-control{
    border-color:rgba(180,35,24,.55);
    background:#fffafa;
    box-shadow:0 0 0 3px rgba(180,35,24,.055);
}

.auth-field.has-error .auth-control>i{
    color:var(--auth-red);
}

.auth-password-toggle{
    width:42px;
    height:42px;
    flex:0 0 auto;
    display:grid;
    place-items:center;
    border:0;
    background:transparent;
    color:#818b84;
    font-size:17px;
    cursor:pointer;
    border-radius:10px;
}

.auth-password-toggle:hover{
    color:var(--auth-green);
    background:#f3f7f3;
}

.auth-field-error,
.auth-field-help{
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:6px;
    font-size:9px;
    line-height:1.45;
}

.auth-field-error{
    color:var(--auth-red);
}

.auth-field-error i{
    margin-top:1px;
}

.auth-field-help{
    color:#879089;
}

.auth-form-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin:2px 0 17px;
}

.auth-checkbox{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#566158;
    font-size:10px;
    cursor:pointer;
    user-select:none;
}

.auth-checkbox input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.auth-checkbox-box{
    width:17px;
    height:17px;
    display:grid;
    place-items:center;
    border:1px solid #cdd4cf;
    border-radius:5px;
    background:#fff;
    color:transparent;
    font-size:12px;
    transition:.14s ease;
}

.auth-checkbox input:checked+.auth-checkbox-box{
    color:#fff;
    border-color:var(--auth-green);
    background:var(--auth-green);
}

.auth-checkbox input:focus-visible+.auth-checkbox-box{
    box-shadow:0 0 0 3px rgba(23,109,54,.12);
}

.auth-inline-link{
    color:var(--auth-green);
    font-size:10px;
    font-weight:700;
    text-decoration:none;
}

.auth-inline-link:hover{
    text-decoration:underline;
}

.auth-submit,
.auth-secondary-button{
    width:100%;
    min-height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    border-radius:12px;
    font-family:'Inter',sans-serif;
    font-size:11px;
    font-weight:700;
    cursor:pointer;
    transition:transform .15s ease,box-shadow .15s ease,background .15s ease,opacity .15s ease;
}

.auth-submit{
    border:1px solid var(--auth-green);
    color:#fff;
    background:linear-gradient(180deg,#1d7a3d 0%,#176d36 100%);
    box-shadow:0 8px 18px rgba(23,109,54,.16);
}

.auth-submit:hover:not(:disabled){
    transform:translateY(-1px);
    background:linear-gradient(180deg,#1c743a 0%,#125d2e 100%);
    box-shadow:0 10px 22px rgba(23,109,54,.2);
}

.auth-submit:active:not(:disabled){
    transform:translateY(0);
}

.auth-submit:disabled,
.auth-secondary-button:disabled{
    opacity:.68;
    cursor:wait;
}

.auth-submit-icon{
    display:grid;
    place-items:center;
    font-size:16px;
}

.auth-submit.is-loading .auth-submit-icon i,
.auth-secondary-button.is-loading>i{
    animation:auth-spin .75s linear infinite;
}

@keyframes auth-spin{
    to{transform:rotate(360deg)}
}

.auth-divider{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:19px 0 15px;
    color:#a2aaa4;
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:.09em;
}

.auth-divider::before,
.auth-divider::after{
    content:"";
    height:1px;
    flex:1;
    background:#ebeeeb;
}

.auth-divider span{
    padding:0 11px;
}

.auth-switch{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    color:#7b857e;
    font-size:10px;
    text-align:center;
}

.auth-switch a{
    display:inline-flex;
    align-items:center;
    gap:4px;
    color:var(--auth-green);
    font-weight:700;
    text-decoration:none;
}

.auth-switch a:hover{
    text-decoration:underline;
}

.auth-switch-single{
    margin-top:17px;
}

.auth-security-note{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin:4px 0 16px;
    padding:10px 11px;
    color:#6d776f;
    font-size:9px;
    line-height:1.5;
    border-radius:10px;
    background:#f7f8f6;
    border:1px solid #ecefec;
}

.auth-security-note i{
    margin-top:1px;
    color:var(--auth-green);
    font-size:14px;
}

.auth-password-meter{
    height:4px;
    margin-top:7px;
    overflow:hidden;
    border-radius:999px;
    background:#edf0ed;
}

.auth-password-meter span{
    display:block;
    width:0;
    height:100%;
    border-radius:inherit;
    background:#c6a348;
    transition:width .18s ease,background .18s ease;
}

.auth-password-meter span.is-weak{width:30%;background:#c84a3d}
.auth-password-meter span.is-medium{width:65%;background:#c28a21}
.auth-password-meter span.is-strong{width:100%;background:#2b8a4b}

.auth-verify-hero{
    text-align:center;
    margin-bottom:22px;
}

.auth-verify-icon{
    width:66px;
    height:66px;
    display:grid;
    place-items:center;
    margin:0 auto 15px;
    border-radius:21px;
    color:var(--auth-green);
    background:var(--auth-green-soft);
    border:1px solid rgba(23,109,54,.12);
    font-size:31px;
    box-shadow:0 12px 30px rgba(23,109,54,.09);
}

.auth-verify-hero .auth-eyebrow{
    margin-bottom:8px;
    color:var(--auth-green);
}

.auth-verify-hero p{
    max-width:390px;
    margin:9px auto 0;
    color:var(--auth-muted);
    font-size:11px;
    line-height:1.65;
}

.auth-verify-hero strong{
    color:#3d4941;
}

.auth-email-steps{
    display:grid;
    gap:8px;
    margin-bottom:18px;
}

.auth-email-steps>div{
    display:grid;
    grid-template-columns:24px 1fr;
    gap:9px;
    align-items:center;
    padding:9px 10px;
    border-radius:10px;
    background:#f8f9f7;
    border:1px solid #edf0ed;
}

.auth-email-steps span{
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    border-radius:8px;
    color:var(--auth-green);
    background:var(--auth-green-soft);
    font-size:9px;
    font-weight:700;
}

.auth-email-steps p{
    margin:0;
    color:#657068;
    font-size:9px;
    line-height:1.45;
}

.auth-secondary-form{
    margin-top:9px;
}

.auth-secondary-button{
    border:1px solid #dfe4df;
    color:#526057;
    background:#fff;
    box-shadow:none;
}

.auth-secondary-button:hover:not(:disabled){
    color:var(--auth-green);
    border-color:rgba(23,109,54,.3);
    background:#f7faf7;
}

.auth-help-note{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin-top:16px;
    color:#8a938d;
    font-size:9px;
    text-align:center;
}

@media(max-width:860px){
    .auth-shell{
        width:min(560px,calc(100% - 30px));
        min-height:0;
        grid-template-columns:1fr;
        margin-top:72px;
        border-radius:24px;
    }

    .auth-showcase{display:none}
    .auth-panel{padding:34px 42px 40px}
}

@media(max-width:560px){
    .auth-body{background:#f5f5f0}
    .auth-decoration{display:none}
    .auth-home-link{
        position:absolute;
        top:14px;
        left:14px;
        background:transparent;
        border-color:transparent;
        padding-left:4px;
    }

    .auth-shell{
        width:100%;
        margin:52px 0 0;
        border:0;
        border-radius:24px 24px 0 0;
        box-shadow:none;
        background:#fff;
    }

    .auth-panel{
        min-height:calc(100vh - 52px);
        justify-content:flex-start;
        padding:24px 22px 34px;
        border-radius:24px 24px 0 0;
    }

    .auth-panel-inner{margin:0 auto}
    .auth-panel-brand{margin-bottom:22px}
    .auth-panel-brand img{max-width:120px;max-height:120px}
    .auth-form-head{grid-template-columns:43px 1fr;gap:12px;margin-bottom:23px}
    .auth-form-icon{width:43px;height:43px;border-radius:13px;font-size:20px}
    .auth-form-head h2,.auth-verify-hero h2{font-size:22px}
    .auth-form-head p{font-size:10px}
    .auth-form-row{align-items:flex-start}
}

@media(max-width:360px){
    .auth-panel{padding-left:17px;padding-right:17px}
    .auth-form-row{flex-direction:column;gap:9px}
}


