:root{color-scheme:light;--blue:#1769e0;--ink:#112d59;--muted:#718099;--line:#e4ebf5;--surface:#fff;--bg:#f6f9fe;--pist:#b9ef8b;font-family:'DM Sans',sans-serif}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font-size:15px}
button,input{font:inherit}
button,a{cursor:pointer}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #81abf1;outline-offset:3px}
.page-shell{max-width:1380px;margin:auto;min-height:100vh;padding:28px 6% 20px}
.page-header{display:flex;justify-content:space-between;align-items:center;gap:16px}
.brand{display:inline-flex;align-items:center;gap:10px;font:800 22px Manrope,sans-serif;letter-spacing:-1px;color:#143569}
.brand-icon{width:38px;height:38px;background:var(--blue);border-radius:12px;display:grid;place-items:center;color:white;font-size:20px}
.brand-accent{color:var(--blue)}
.back-link{font-size:13px;font-weight:700;color:#5f779a}
.back-link:hover{color:var(--blue)}
.login-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,470px);gap:9%;align-items:center;min-height:calc(100vh - 135px);max-width:1120px;margin:0 auto}
.intro{position:relative;padding:38px 0;isolation:isolate}
.eyebrow{color:#1769e0;font-size:11px;font-weight:800;letter-spacing:1.6px;display:flex;align-items:center;gap:10px}
.eyebrow span{background:#e5f0ff;border-radius:9px;padding:8px;font-size:13px;letter-spacing:0}
h1,h2,h3,p{margin-top:0}
h1{font:800 clamp(40px,4.8vw,62px)/1.13 Manrope,sans-serif;letter-spacing:-2.7px;margin:23px 0 20px}
h1 span{color:var(--blue)}
.intro>p{max-width:430px;color:#677e9f;line-height:1.75;font-size:16px}
.intro-card{display:flex;gap:14px;align-items:center;max-width:390px;padding:17px;background:#f0f7e9;border:1px solid #e0efce;border-radius:17px;margin-top:38px;font-size:13px;line-height:1.65;color:#627d53}
.intro-card strong{color:#375f31}
.intro-card-icon{width:37px;height:37px;flex:none;display:grid;place-items:center;color:#4d8b31;background:#ddefcf;border-radius:12px;font-size:18px}
.decoration{position:absolute;z-index:-1;border-radius:50%;opacity:.68}
.decoration-one{width:135px;height:135px;background:#e8f2ff;right:0;top:10px}
.decoration-two{width:48px;height:48px;background:#dcf5c9;right:105px;top:120px}
.card{background:var(--surface);border:1px solid #e7edf6;border-radius:24px;box-shadow:0 16px 55px #27538a0e;padding:36px 38px}
.card-kicker{font-size:10px;color:#8b9cb4;letter-spacing:1.5px;font-weight:800;margin-bottom:11px}
h2{font:800 29px Manrope,sans-serif;letter-spacing:-1px;margin-bottom:7px}
.card-subtitle{color:#8191aa;font-size:13px;margin-bottom:24px}
.tabs{display:grid;grid-template-columns:1fr 1fr;background:#f1f5fb;border-radius:12px;padding:4px;margin:0 0 22px}
.tabs button{border:0;background:transparent;color:#8291a6;font-size:13px;font-weight:700;padding:11px 5px;border-radius:9px}
.tabs button[aria-selected=true]{background:#fff;box-shadow:0 2px 8px #18365f12;color:var(--blue)}
.google-button{width:100%;display:flex;justify-content:center;align-items:center;gap:11px;border:1px solid #dfe7f3;border-radius:11px;padding:12px;background:#fff;color:#244465;font-weight:700;font-size:13px}
.google-button:hover{background:#f8fbff;border-color:#b8ccee}
.divider{display:flex;align-items:center;gap:13px;color:#a0aec1;font-size:11px;margin:19px 0}
.divider:before,.divider:after{content:'';height:1px;background:#e9eef6;flex:1}
form label{display:block;font-size:12px;font-weight:700;color:#425d80;margin:0 0 8px}
form input{width:100%;border:1px solid #dfe7f3;border-radius:11px;padding:13px 14px;background:#fbfcff;color:#173455;outline:none;margin-bottom:17px}
form input::placeholder{color:#aab7c9}
form input:focus{border-color:#6ea0f0;box-shadow:0 0 0 3px #e4efff}
.label-row{display:flex;justify-content:space-between;align-items:start;gap:8px}
.password-hint{font-size:11px;color:#617897;line-height:1.5;margin:-2px 0 8px}
.text-button{border:0;background:none;padding:0;color:var(--blue);font-size:12px;font-weight:700}
.text-button:hover{text-decoration:underline}
.primary-button{display:flex;justify-content:center;align-items:center;gap:10px;width:100%;border:0;border-radius:11px;background:var(--blue);color:white;padding:14px;font-weight:700;font-size:13px;text-align:center}
.primary-button:hover{background:#0d5cca}
button:disabled{cursor:wait;opacity:.6}
.progress-note{font-size:11px;color:#8190a6;line-height:1.6;margin:18px 0 0}
.feedback{border-radius:10px;padding:11px 13px;font-size:12px;line-height:1.5;margin-bottom:18px;background:#edf6ff;color:#255487}
.feedback.error{background:#fff1ef;color:#a1362a}
.feedback.success{background:#edf8e8;color:#3e7136}
.loading{color:#8191aa;font-size:13px;padding:12px 0}
.account-view{text-align:center}
.account-icon{display:grid;place-items:center;margin:5px auto 15px;width:48px;height:48px;background:#e6f5df;border-radius:16px;color:#4b943f;font-size:23px}
.account-view h3{font:800 19px Manrope,sans-serif;margin-bottom:8px}
.account-view>p:not(.progress-note){font-size:13px;color:#718099;overflow-wrap:anywhere}
.account-view .primary-button{margin-top:22px}
.signout{margin-top:18px}
footer{text-align:center;color:#a1adc0;font-size:11px}footer span{color:#77b767}
@media(max-width:820px){.page-shell{padding:24px 20px 20px}.login-layout{grid-template-columns:1fr;gap:8px;max-width:480px;min-height:auto;padding:38px 0}.intro{padding:0 0 12px}.intro>p{font-size:14px;line-height:1.65}.intro-card,.decoration{display:none}.eyebrow{font-size:10px}.eyebrow span{padding:6px}h1{font-size:36px;letter-spacing:-1.5px;margin:17px 0 12px}.card{padding:28px 24px}footer{padding-bottom:4px}}
@media(max-width:380px){.page-shell{padding-left:14px;padding-right:14px}.card{padding:25px 19px}.back-link{font-size:12px}h1{font-size:32px}}