:root { --pine:#243e35; --lime:#d9f28c; --ink:#20352d; --muted:#68776f; --line:#dce3dc; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#f8f9f5; font-family:Arial,Helvetica,sans-serif; font-size:15px; line-height:1.5; }
a { color:inherit; text-underline-offset:4px; }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #699346; outline-offset:4px; }
.skip-link { position:absolute; left:16px; top:-80px; background:white; padding:12px; z-index:10; }
.skip-link:focus { top:16px; }
.auth-shell { min-height:100dvh; display:grid; grid-template-columns:minmax(370px,46%) 1fr; }
.auth-story { position:relative; overflow:hidden; display:flex; flex-direction:column; padding:44px 10%; color:#f4f6ed; background:radial-gradient(ellipse at 5% 95%,#48634a 0,transparent 60%),#243e35; }
.auth-story::after { content:""; width:650px; height:650px; border:1px solid #ffffff0c; border-radius:50%; position:absolute; right:-400px; top:100px; box-shadow:0 0 0 60px #ffffff03,0 0 0 120px #ffffff03; pointer-events:none; }
.auth-brand { display:flex; align-items:center; gap:12px; width:fit-content; text-decoration:none; font-size:26px; letter-spacing:-1px; font-weight:700; z-index:1; }
.auth-brand img { width:45px; height:45px; filter:brightness(0) invert(1); }
.brand-small { display:block; font:9px/1.8 Arial,sans-serif; letter-spacing:2.5px; color:#c7d5c8; }
.story-content { margin:auto 0; padding:68px 0 42px; max-width:490px; position:relative; z-index:1; }
.eyebrow { display:block; font-size:10px; letter-spacing:2px; font-weight:700; }
.auth-story .eyebrow { color:var(--lime); }
.story-content h1 { font:normal clamp(42px,4.4vw,68px)/1.07 Georgia,serif; letter-spacing:-2px; margin:24px 0; }
.story-content h1 em { color:var(--lime); font-weight:normal; }
.story-content>p { max-width:355px; color:#cfdbd0; font-size:15px; line-height:1.8; }
.insight-art { border:1px solid #d9f28c2b; background:#ffffff06; border-radius:16px; padding:22px; margin-top:40px; max-width:370px; }
.art-label { display:flex; justify-content:space-between; align-items:center; color:#d6e2d1; font-size:9px; letter-spacing:1.5px; margin-bottom:20px; }
.art-label span:last-child { font-size:20px; color:var(--lime); }
.art-line { display:flex; align-items:center; gap:12px; margin:13px 0; }
.art-line i { width:7px; height:7px; border-radius:50%; background:#d9f28c; }
.art-line span { height:6px; border-radius:2px; width:20%; background:#ffffff25; }
.art-line b { height:14px; border-radius:3px; width:65%; background:linear-gradient(90deg,#93af69,#d9f28c); }
.art-line:nth-child(3) b { width:46%; opacity:.75; }
.art-line:nth-child(4) b { width:31%; opacity:.5; }
.art-caption { font-size:10px; color:#bccbbd; margin-top:18px; }
.story-footer { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:10px; color:#c7d5c8; z-index:1; }
.auth-main { display:flex; flex-direction:column; padding:36px 7%; }
.auth-topline { display:flex; justify-content:space-between; gap:20px; font-size:12px; color:var(--muted); }
.auth-topline>a { text-decoration:none; }
.auth-topline span a { color:var(--pine); font-weight:700; margin-left:5px; }
.auth-card { margin:auto; padding:64px 0; width:100%; max-width:425px; }
.card-eyebrow { color:#748362; letter-spacing:1.6px; }
.auth-card h2 { font:normal 38px/1.12 Georgia,serif; letter-spacing:-1.2px; margin:14px 0; }
.auth-intro { color:var(--muted); margin:0 0 30px; font-size:14px; }
.social-button,.primary-button,.secondary-button { border-radius:9px; min-height:50px; padding:12px 18px; display:flex; align-items:center; justify-content:center; gap:12px; width:100%; font-weight:700; text-decoration:none; cursor:pointer; }
.social-button { border:1px solid #cdd7ce; color:#293a32; background:white; font-size:14px; }
.social-button:hover { background:#f0f3eb; border-color:#8b9b89; }
.social-providers { display:grid; gap:10px; }
.auth-divider { display:flex; gap:14px; align-items:center; margin:24px 0; color:#839082; font-size:11px; }
.auth-divider::before,.auth-divider::after { content:""; height:1px; flex:1; background:var(--line); }
.auth-form { display:grid; gap:17px; }
.form-field>label { display:block; margin-bottom:7px; font-size:12px; font-weight:700; }
.form-field input:not([type=checkbox]):not([type=radio]),.form-field select,.form-field textarea { width:100%; background:white; border:1px solid #d4ddd3; border-radius:8px; min-height:47px; padding:12px 13px; color:var(--ink); transition:border-color .15s; }
.form-field input:focus { border-color:#678953; }
.form-field input[aria-invalid=true] { border-color:#b4483f; }
.password-field { position:relative; }
.password-field input { padding-right:68px!important; }
.password-toggle { position:absolute; right:5px; top:4px; bottom:4px; background:transparent; border:0; padding:8px 12px; color:var(--pine); font-size:11px; font-weight:700; cursor:pointer; border-radius:5px; }
.checkbox-field { display:flex; flex-wrap:wrap; align-items:center; gap:9px; }
.checkbox-field label { margin:0; font-weight:400; }
input[type=checkbox],input[type=radio] { accent-color:var(--pine); width:16px; height:16px; }
.form-field div:has(>label>input[type=radio]) { padding:10px; margin:6px 0; border:1px solid var(--line); border-radius:8px; }
.form-field label:has(input[type=radio]) { display:flex; align-items:center; gap:9px; font-size:13px; }
.field-help { font-size:11px; color:var(--muted); margin-top:6px; }
.field-help ul { padding-left:18px; margin:5px 0; }
.field-errors,.form-errors { color:#9c312d; font-size:12px; }
.form-errors { background:#fff0eb; padding:12px; border-radius:8px; }
.errorlist { margin:4px 0 0; padding-left:18px; }
.forgot-link { font-size:12px; justify-self:end; color:var(--pine); font-weight:700; }
.primary-button { background:var(--pine); border:1px solid var(--pine); color:white; font-size:14px; margin-top:4px; }
.primary-button:hover { background:#365443; }
.primary-button span { margin-left:auto; font-size:19px; font-weight:400; }
.secondary-button { border:1px solid var(--line); background:white; color:var(--pine); }
.auth-note { font-size:12px; color:var(--muted); text-align:center; margin:22px 0; }
.auth-messages { background:#edf3e5; padding:12px; border-radius:8px; font-size:13px; margin-bottom:18px; }
.auth-messages p { margin:0; }
.auth-footer { color:#899286; text-align:center; font-size:10px; padding:12px 0; }
@media(max-width:1000px) { .auth-story { padding:32px 8%; } .auth-main { padding:28px 7%; } .auth-topline { flex-wrap:wrap; font-size:11px; } }
@media(max-width:760px) { .auth-shell { display:block; } .auth-story { padding:20px 24px; } .auth-brand { font-size:23px; } .auth-brand img { width:35px; height:35px; } .story-content,.story-footer { display:none; } .auth-main { padding:24px; min-height:calc(100dvh - 85px); } .auth-card { padding:40px 0; } .auth-card h2 { font-size:34px; } }
@media(prefers-reduced-motion:reduce) { * { transition:none!important; scroll-behavior:auto!important; } }