:root{color-scheme:light;--ink:#202d28;--muted:#67736c;--green:#285b47;--line:#dce2dc;--cream:#f6f7f2}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.5}
a{color:var(--green);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:4px}
button,input{font:inherit}
button,a,input{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #a67b32;outline-offset:4px}
.registration-shell{display:grid;grid-template-columns:minmax(340px,.95fr) minmax(540px,1.05fr);min-height:100vh;min-height:100svh;max-width:1800px;margin:0 auto}
.welcome-panel{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:44px clamp(30px,5vw,86px);background:#e9eee4}
.welcome-panel:after{content:"";position:absolute;right:-180px;bottom:-220px;width:540px;height:540px;border:1px solid #cad5c5;border-radius:50%;box-shadow:0 0 0 65px #dfe7d947,0 0 0 130px #dfe7d947;pointer-events:none}
.brand{display:flex;align-items:center;gap:12px;font-size:19px;font-weight:700;letter-spacing:-.6px;color:var(--ink);align-self:flex-start}
.brand:hover{text-decoration:none}
.brand-logo{display:block;width:156px;max-width:100%;height:auto;max-height:64px;object-fit:contain;object-position:left center}
.welcome-content{position:relative;z-index:1;margin:auto 0;padding:64px 0;max-width:470px}
.eyebrow,.form-kicker{font-size:10px;font-weight:700;letter-spacing:2.3px;color:var(--green)}
.eyebrow{display:flex;align-items:center;gap:10px}
.eyebrow>span{width:7px;height:7px;background:var(--green);border-radius:50%}
h1{font-size:clamp(40px,4.3vw,66px);font-weight:500;line-height:1.12;letter-spacing:-2.6px;margin:26px 0}
h1 em{font-family:Georgia,"Times New Roman",serif;font-weight:400;color:var(--green)}
.welcome-description{max-width:330px;font-size:16px;line-height:1.8;color:var(--muted)}
.learning-card{display:flex;align-items:flex-start;gap:16px;padding:23px;margin-top:36px;border:1px solid #d1dbca;border-radius:16px;background:#ffffff68}
.card-icon{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border-radius:11px;background:#dbe5d4;color:var(--green);font-size:24px}
.learning-card strong{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.learning-card p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}
.topic-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.topic-tags span{font-size:10px;border:1px solid #cdd8c7;border-radius:30px;padding:6px 11px;color:#50614e}
.welcome-footer{position:relative;z-index:1;font-size:12px;color:var(--muted);margin:0}
.form-panel{display:flex;flex-direction:column;padding:40px clamp(28px,5vw,84px);background:#fff}
.back-link{align-self:flex-start;font-size:12px;color:var(--muted);display:flex;gap:9px;align-items:center}
.back-link span{font-size:19px}
.form-content{width:100%;max-width:480px;margin:auto;padding:38px 0}
.form-heading{margin-bottom:28px}
h2{font-size:32px;letter-spacing:-1.2px;line-height:1.2;font-weight:650;margin:12px 0}
.form-heading p{color:var(--muted);margin:0;font-size:13px}
.form-heading a{font-weight:600;margin-left:4px}
.field{margin-bottom:18px;min-width:0}
label{display:block;font-size:12px;font-weight:600;margin-bottom:7px}
input:not([type=checkbox]){width:100%;height:47px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:0 13px;color:var(--ink);transition:border-color .15s,box-shadow .15s}
input::placeholder{color:#919a94;font-size:12px}
input:not([type=checkbox]):focus{border-color:var(--green);box-shadow:0 0 0 3px #285b4710}
input[aria-invalid=true]{border-color:#b43e3e}
.password-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.password-input{position:relative}
.password-input input{padding-right:54px}
.password-toggle{position:absolute;right:5px;top:5px;height:37px;padding:0 8px;border:0;border-radius:5px;background:transparent;font-size:11px;color:var(--green);font-weight:600;cursor:pointer}
.password-toggle:hover{background:#eef3ed}
small{display:block;font-size:11px;color:var(--muted);margin-top:6px}
.verification-box{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#f6f8f4;border:1px solid #e4e9df;border-radius:10px;padding:14px 16px}
.verification-box label{margin-bottom:2px}
.verification-box small{margin:0}
.verification-box input{max-width:110px;height:42px}
.field-error{color:#a92e2e;font-size:12px;margin:6px 0 0}
.terms-field{margin:21px 0}
.terms-field label{display:flex;align-items:flex-start;gap:10px;font-weight:400;font-size:12px;color:#566159;cursor:pointer;margin:0}
input[type=checkbox]{width:16px;height:16px;margin:1px 0 0;accent-color:var(--green);flex-shrink:0}
.submit-button{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;min-height:49px;background:var(--green);border:1px solid var(--green);border-radius:8px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 4px 9px #285b4717;transition:background .15s}
.submit-button:hover{background:#1e4938}
.submit-button span{font-size:20px;font-weight:400}
.form-note{text-align:center;font-size:11px;color:var(--muted);margin:13px 0 0}
.form-footer{text-align:center;font-size:10px;color:var(--muted)}
@media(min-width:1500px){.registration-shell{min-height:100svh}.form-content{max-width:500px}}
@media(max-width:1000px){.registration-shell{grid-template-columns:minmax(290px,.8fr) minmax(420px,1.2fr)}.welcome-panel{padding:32px}.form-panel{padding:32px}.password-grid{grid-template-columns:1fr;gap:0}h1{font-size:44px}.learning-card{padding:16px}}
@media(max-width:740px){.registration-shell{grid-template-columns:1fr}.welcome-panel{padding:24px}.welcome-content{padding:30px 0 8px;max-width:none}.eyebrow,.welcome-description,.learning-card,.topic-tags,.welcome-footer{display:none}h1{font-size:34px;letter-spacing:-1.3px;margin:0}h1 br{display:none}h1 br:after{content:" "}h1 em{display:block;margin-top:4px}.form-panel{padding:24px}.form-content{max-width:480px;padding:28px 0}.form-footer{padding-bottom:4px}.brand{font-size:17px}.brand-mark{width:33px;height:33px;font-size:22px}h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.login-options{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:22px 0;font-size:12px}
.login-options label{display:flex;align-items:center;gap:9px;margin:0;font-weight:400;color:var(--muted);cursor:pointer}
@media(max-width:740px){.brand-logo{width:136px;max-height:54px}}

/* Sign-in page */
.login-page{background:#f2f4ee;padding:32px}
.login-page .registration-shell{max-width:1260px;min-height:calc(100svh - 64px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid #dfe5da;border-radius:24px;overflow:hidden;box-shadow:0 24px 70px #243d2910}
.login-page .welcome-panel{padding:40px clamp(28px,4vw,60px);background:linear-gradient(145deg,#edf2e6,#e0e9d9)}
.login-page .welcome-content{padding:54px 0;max-width:420px}
.login-page h1{font-size:clamp(38px,4.2vw,58px);line-height:1.16;letter-spacing:-2px}
.login-page .welcome-description{font-size:15px;max-width:320px}
.login-page .learning-card{background:#ffffff85;border-color:#cdd9c6;max-width:370px;margin-top:32px}
.login-page .form-panel{padding:35px clamp(28px,4.5vw,70px)}
.login-page .form-content{max-width:380px;padding:48px 0}
.login-page .form-heading{margin-bottom:32px}
.login-page h2{font-size:36px;letter-spacing:-1.3px;margin:13px 0 10px}
.login-page .login-intro{font-size:14px;line-height:1.75;max-width:320px}
.login-page .field{margin-bottom:22px}
.login-page label{font-size:13px;margin-bottom:9px}
.login-page input:not([type=checkbox]){height:52px;border-radius:10px;background:#fcfdfb;padding-left:15px;font-size:16px}
.login-page input::placeholder{font-size:13px}
.login-page .password-input input{padding-right:60px}
.login-page .password-toggle{top:7px;height:38px;right:7px}
.login-page .login-options{margin:4px 0 26px;gap:14px;font-size:12px}
.login-page .login-options label{font-size:12px;margin-bottom:0}
.login-page .login-options a{font-weight:600}
.login-page .submit-button{min-height:52px;border-radius:10px;font-size:14px}
.signup-divider{display:flex;align-items:center;gap:12px;margin:27px 0 19px;color:var(--muted);font-size:11px;text-align:center}
.signup-divider:before,.signup-divider:after{content:"";height:1px;background:var(--line);flex:1}
.create-account-link{display:flex;align-items:center;justify-content:center;gap:12px;min-height:48px;border:1px solid var(--line);border-radius:10px;font-size:13px;font-weight:600;background:#fff}
.create-account-link:hover{background:#f3f6ef;text-decoration:none;border-color:#9eaf99}
.login-page .form-footer{font-size:11px;line-height:1.7}
@media(max-width:1000px){.login-page{padding:20px}.login-page .registration-shell{min-height:calc(100svh - 40px)}.login-page .welcome-panel,.login-page .form-panel{padding:30px}.login-page h1{font-size:40px}.login-page .topic-tags{gap:6px}}
@media(max-width:740px){.login-page{padding:0;background:#fff}.login-page .registration-shell{min-height:100svh;grid-template-columns:1fr;border:0;border-radius:0;box-shadow:none}.login-page .welcome-panel{padding:24px 24px 27px}.login-page .welcome-content{padding:24px 0 0}.login-page h1{font-size:30px;letter-spacing:-1px;margin:0}.login-page h1 em{font-size:27px}.login-page .form-panel{padding:22px 24px 26px}.login-page .form-content{padding:30px 0 36px;max-width:420px}.login-page h2{font-size:30px}.login-page .form-heading{margin-bottom:26px}.login-page .learning-card{display:none}}
@media(max-width:360px){.login-page .form-panel,.login-page .welcome-panel{padding-left:18px;padding-right:18px}.login-page .login-options{font-size:11px}.signup-divider{font-size:10px}}
