.login-page{margin:0;background:#f5f5ee;color:#203c30;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
.login-page *{box-sizing:border-box}
.login-page:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 35% 60%,#d9e1ca66,transparent 55%);z-index:-1}
.panel-header{height:108px;max-width:1440px;margin:auto;padding:0 64px;display:flex;align-items:center;gap:28px}
.login-brand{display:inline-flex;align-items:center;color:#244c39;text-decoration:none;font-size:28px;font-weight:700;letter-spacing:-1.7px;line-height:1}
.brand-divider{height:20px;width:1px;background:#bbc6b6;margin:0 18px 0 24px}
.brand-product{font-size:11px;letter-spacing:.7px;font-weight:450;color:#687c68}
.header-caption{margin-left:auto;font-size:9px;letter-spacing:1.8px;color:#7b8b78}
.login-language{display:inline-flex;gap:8px;align-items:center;justify-content:center;min-height:38px;padding:9px 13px;border:1px solid #d4dcce;border-radius:30px;color:#52644d;background:transparent;font-family:inherit;font-size:10px;font-weight:500;cursor:pointer;transition:background .2s}
.login-language svg{stroke:currentColor;stroke-width:1}
.login-language:hover{background:#e8edde}
.login-layout{max-width:1320px;padding:24px 64px 30px;margin:auto;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:72px;min-height:calc(100svh - 178px)}
.login-story{position:relative;min-width:0;align-self:center;padding:30px 0 16px}
.story-copy{position:relative;z-index:1}
.login-eyebrow{display:flex;align-items:center;gap:10px;font-size:8px;letter-spacing:1.7px;font-weight:550;color:#697c61;line-height:1.6}
.eyebrow-line{width:22px;height:1px;background:#78916b;flex-shrink:0}
.login-story h1{font-family:"Songti SC","Noto Serif CJK SC","STSong",serif;font-size:clamp(50px,5.3vw,78px);font-weight:500;letter-spacing:-2px;line-height:1.23;margin:26px 0 22px}
.login-story h1 span{color:#718b5c}
.login-story p{font-size:12px;line-height:2;color:#7c8774;max-width:330px;margin:0;letter-spacing:.25px}
.story-art{margin:-18px -38px -20px -54px;pointer-events:none;position:relative}
.story-art svg{display:block;width:100%;max-height:370px}
.story-bottom{display:flex;align-items:center;gap:11px;font-size:10px;letter-spacing:.7px;color:#839079;margin-top:16px}
.story-bottom-rule{width:26px;height:1px;background:#a4b197}
.login-panel{min-width:0;position:relative;padding:10px 0}
.login-panel:before{content:"";position:absolute;inset:-22px 22px 36px -22px;border:1px solid #dfe5d5;border-radius:22px;pointer-events:none}
.login-card{position:relative;background:#fffffc;border:1px solid #e5e8dc;border-radius:18px;padding:30px 36px 32px;box-shadow:0 28px 60px -38px #2e4d2a3b,0 2px 4px #384b2403;width:100%;max-width:410px;margin:auto}
.card-topline{display:flex;align-items:center;justify-content:space-between;padding-bottom:25px;margin-bottom:43px;border-bottom:1px solid #eaede3;font-size:7px;letter-spacing:1.5px;color:#8b9581}
.access-dot{width:6px;height:6px;border-radius:50%;background:#90a977;box-shadow:0 0 0 4px #f0f4e9}
.signin-eyebrow{font-size:10px;letter-spacing:.8px;color:#718063;margin:0 0 14px}
.login-card h2{font-size:31px;font-weight:550;line-height:1.3;letter-spacing:-1px;margin:0 0 15px}
.login-copy{font-size:12px;line-height:1.9;color:#6e7966;margin:0;max-width:270px}
.microsoft-button{min-height:54px;display:flex;align-items:center;gap:12px;margin-top:32px;padding:12px 14px;background:#224b37;border:1px solid #224b37;border-radius:7px;color:#fff;text-decoration:none;font-size:12px;font-weight:500;letter-spacing:.2px;box-shadow:0 4px 9px #193c2510;transition:background .2s,transform .2s,box-shadow .2s}
.microsoft-mark{display:grid;place-items:center;flex-shrink:0;width:26px;height:26px;background:#fff;border-radius:3px}
.signin-arrow{margin-left:auto;color:#c6d7b8;transition:transform .2s}
.microsoft-button:hover{background:#183e2a;transform:translateY(-2px);box-shadow:0 8px 16px #193c2526}
.microsoft-button:hover .signin-arrow{transform:translateX(3px)}
.microsoft-button:active{transform:translateY(0)}
.login-help{font-size:9px;line-height:1.8;text-align:center;color:#77836b;margin:14px 0 0}
.login-divider{height:1px;background:#e9ecdf;margin:36px 0 22px}
.login-assurance{display:flex;gap:7px;align-items:center;justify-content:center;font-size:10px;color:#7e8d74;margin:0}
.panel-footer{max-width:1440px;padding:20px 64px 26px;margin:auto;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:9px;color:#8d9682;letter-spacing:.3px}
.panel-footer>span:nth-child(2){font-size:7px;letter-spacing:1.7px}
.login-page :focus-visible{outline:2px solid #829a61;outline-offset:5px}
.login-status{font-size:12px;padding:12px 14px;background:#f4ede0;border:1px solid #e5dac6;border-radius:7px;line-height:1.8;color:#7e6130;margin-top:20px}
#pending{font-size:12px;line-height:1.9;color:#657661;margin-top:25px}
#request-id{display:block;background:#e9eee3;border:1px solid #dce4d5;border-radius:6px;padding:10px;overflow-wrap:anywhere;font-size:10px;margin:15px 0}
#pending button{display:block;margin:14px 0;font-family:inherit;cursor:pointer}
.login-page .btn{padding:11px 16px;border:1px solid #214b3a;border-radius:6px;font-size:12px;background:#214b3a;color:#fff}
.login-page .text-link{padding:0;border:0;background:none;color:#64735f;font-size:11px;text-decoration:underline;text-underline-offset:3px}
.login-page [hidden]{display:none!important}
.data-status{position:fixed;right:20px;bottom:12px;background:#f8f9f5f5;border:1px solid #e4e8dd;border-radius:8px;padding:7px 11px;font-size:10px;color:#7a8973;z-index:50;max-width:calc(100vw - 100px)}
.startup-error{max-width:500px;margin:15vh auto;padding:30px}.startup-error h1{font-size:23px}.startup-error p{color:#7f887a;line-height:1.8}
@media(min-width:1400px){.login-layout{gap:110px}.story-art svg{max-height:410px}.login-card{padding:34px 40px 36px}.card-topline{margin-bottom:52px}}
@media(max-width:1050px){.panel-header{padding:0 34px;height:92px}.login-layout{padding:16px 42px 28px;gap:46px;min-height:calc(100svh - 160px)}.login-story h1{font-size:55px}.login-eyebrow{font-size:8px;letter-spacing:1px}.story-art{margin:0 -30px -10px -35px}.login-card{padding:27px 25px}.card-topline{font-size:8px;letter-spacing:1px}.panel-footer{padding:20px 34px 24px}.header-caption{font-size:7px}.login-panel:before{inset:-16px 16px 30px -16px}}
@media(max-width:720px){.panel-header{padding:0 24px;height:84px;gap:12px}.login-brand{font-size:25px}.brand-divider{margin:0 12px;height:16px}.brand-product{font-size:10px}.header-caption{display:none}.login-language{margin-left:auto;min-height:34px;padding:7px 11px}.login-layout{display:flex;flex-direction:column;gap:26px;padding:10px 28px 28px;min-height:0}.login-story{width:100%;padding:17px 0 0;overflow:hidden}.login-eyebrow{font-size:6px;letter-spacing:1px}.login-story h1{font-size:47px;line-height:1.2;margin:22px 0 18px;position:relative;z-index:1}.login-story p{font-size:10px;max-width:210px;position:relative;z-index:1;line-height:1.9}.story-art{position:absolute;right:-65px;top:80px;width:250px;margin:0;opacity:.78;z-index:0}.story-bottom{margin-top:26px;font-size:8px}.story-bottom-rule{width:16px}.login-panel{width:100%;padding:10px 0 0}.login-panel:before{inset:0 12px 24px -10px;border-radius:18px}.login-card{padding:24px 25px 26px;max-width:100%}.card-topline{margin-bottom:26px;padding-bottom:20px;font-size:6px;letter-spacing:1.2px}.login-card h2{font-size:27px}.signin-eyebrow{font-size:9px;margin-bottom:10px}.login-copy{font-size:11px}.microsoft-button{margin-top:25px;min-height:52px}.login-divider{margin:25px 0 19px}.panel-footer{padding:12px 28px 24px;font-size:8px}.panel-footer>span:nth-child(2){display:none}.data-status{font-size:9px;bottom:6px;right:8px}}
@media(prefers-reduced-motion:no-preference){.story-copy,.story-art,.login-card{animation:arrive .8s both}.story-art{animation-delay:.1s}.login-card{animation-delay:.15s}@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){.microsoft-button,.signin-arrow,.login-language{transition:none}.microsoft-button:hover{transform:none}}
/* Reserve the same text slots in both languages so the card and illustration stay put. */
html{scrollbar-gutter:stable}
.login-language{width:70px;flex-shrink:0;white-space:nowrap}
.login-story h1{line-height:1.23;min-height:2.46em}
.login-story #intro{min-height:48px;line-height:24px}
.login-card .signin-eyebrow{min-height:16px;line-height:16px}
.login-card h2{min-height:41px;line-height:41px}
.login-copy{min-height:46px;line-height:23px}
.login-help{min-height:32px;line-height:16px}
.login-assurance{min-height:28px;line-height:14px}
.login-assurance svg{flex-shrink:0}
.story-bottom{min-height:20px;line-height:20px}
@media(max-width:720px){.login-story #intro{min-height:57px;line-height:19px}.login-story h1{line-height:1.23}.login-card h2{min-height:38px;line-height:38px}.login-copy{min-height:42px;line-height:21px}}