.login-body{margin:0;background:#faf8f3;color:#17243c;font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.login-body *{box-sizing:border-box}.login-body [hidden],.account-access [hidden]{display:none!important}.login-shell{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(360px,1.1fr);min-height:100svh}.login-story{display:flex;flex-direction:column;justify-content:space-between;background:#17243c;color:#fff;padding:clamp(32px,5vw,76px)}.login-brand{display:flex;align-items:center;gap:14px;color:#fff;font-size:1.4rem;text-decoration:none}.login-mark{display:grid;place-items:center;width:48px;height:48px;background:#f35b3f;border-radius:12px;font-size:2rem;line-height:1}.login-story-copy{padding:55px 0}.auth-eyebrow{font-size:.875rem;font-weight:700;letter-spacing:.12em;color:#b74325;margin:0 0 16px}.login-story .auth-eyebrow{color:#ffb792}.login-story h1{font-size:clamp(2.1rem,3.6vw,3.7rem);line-height:1.18;letter-spacing:-.04em;font-weight:600;margin:0 0 26px}.login-story h1 em{font-style:normal;color:#ffb792}.login-story-copy>p:not(.auth-eyebrow){max-width:390px;color:#dbe3ef;font-size:1.0625rem}.login-subjects{display:flex;gap:25px;flex-wrap:wrap;margin-top:38px}.login-subjects>span{font-size:1.6rem;color:#ffb792;display:flex;align-items:center;gap:8px}.login-subjects small{color:#dbe3ef;font-size:.875rem}.login-story-bottom{color:#cbd6e5;font-size:.9375rem;border-top:1px solid #46536c;padding-top:20px;margin:0}.login-form-side{display:flex;align-items:center;justify-content:center;padding:45px 30px}.login-card{width:100%;max-width:410px}.login-card h2{font-size:clamp(1.8rem,3vw,2.25rem);line-height:1.25;letter-spacing:-.03em;margin:0 0 16px}.login-card>p:not(.auth-eyebrow){color:#536077;margin:0 0 26px}.login-card form{display:grid;gap:18px}.login-card label,.account-access label{display:block;font-weight:600;font-size:.9375rem}.login-card input{display:block;width:100%;font:inherit;color:#17243c;background:#fff;border:1px solid #a6afbe;border-radius:10px;padding:12px 14px;margin-top:6px;min-height:48px}.login-card input:focus,.account-access textarea:focus{outline:3px solid #f3b199;outline-offset:2px;border-color:#b74325}.login-card small{display:block;font-size:.875rem;font-weight:400;color:#536077;margin-top:6px}.auth-password{display:flex;align-items:center;position:relative}.auth-password input{padding-right:90px}.auth-password button{position:absolute;right:8px;top:14px;min-height:36px;background:transparent;border:0;font:inherit;font-size:.875rem;color:#96351d;cursor:pointer}.auth-primary,.auth-secondary{display:block;text-align:center;width:100%;border-radius:10px;padding:13px 18px;font:inherit;font-weight:600;min-height:48px;cursor:pointer;text-decoration:none}.auth-primary{border:1px solid #b74325;background:#b74325;color:#fff}.auth-primary:hover{background:#96351d}.auth-secondary{background:#fff;color:#17243c;border:1px solid #a6afbe}.auth-primary:disabled{opacity:.65;cursor:wait}.auth-error{background:#fff0e7;border-left:3px solid #b74325;color:#96351d;padding:12px 14px;border-radius:5px;margin:0;overflow-wrap:anywhere;font-size:.9375rem}.login-help{font-size:.875rem;color:#536077;line-height:1.65;margin:18px 0}.auth-divider{display:flex;align-items:center;gap:15px;margin:25px 0 18px;color:#536077;font-size:.875rem}.auth-divider:before,.auth-divider:after{content:"";height:1px;background:#d9dde3;flex:1}.auth-text{border:0;background:transparent;color:#96351d;font:inherit;font-size:.9375rem;padding:12px 0;cursor:pointer}.login-body a:focus-visible,.login-body button:focus-visible,.account-access button:focus-visible{outline:3px solid #f35b3f;outline-offset:3px}.account-access{margin:22px 0;border-top:1px solid var(--line,#d9dde3);padding-top:22px}.account-access h3,.account-access h4{margin:0 0 12px}.account-access>p{margin:8px 0 16px}.account-access textarea{box-sizing:border-box;width:100%;display:block;font:inherit;font-size:.9375rem;color:#17243c;background:#fff;border:1px solid #a6afbe;border-radius:10px;padding:12px;margin-top:8px;resize:vertical;overflow-wrap:anywhere}.account-access small{font-size:.875rem;display:block;color:var(--muted,#536077);margin-top:8px}.invite-result{padding:18px;background:var(--accent-soft,#fff0e7);border-radius:12px;margin:16px 0}.account-access details{margin-top:22px}.account-access summary{font-weight:600;cursor:pointer;padding:12px 0}.invite-member{border-top:1px solid var(--line,#d9dde3);padding:18px 0}.invite-member p{margin:5px 0}.invite-member .button-row{flex-wrap:wrap}.revoke-confirm{padding:14px;background:var(--accent-soft,#fff0e7);border-radius:10px;margin-top:10px}.revoke-confirm p{margin-top:0}.account-strip>div{min-width:0}.account-strip strong{overflow-wrap:anywhere}.account-strip .text-button{flex-shrink:0}.account-access .auth-error{margin-top:14px}
@media(max-width:760px){.login-shell{grid-template-columns:1fr}.login-story{padding:25px 24px}.login-story-copy{padding:24px 0 6px}.login-story h1{font-size:1.75rem}.login-subjects{margin-top:18px;gap:18px}.login-story-bottom{display:none}.login-form-side{padding:34px 24px 50px}.login-card{max-width:460px}.account-strip{align-items:flex-start;gap:12px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.login-body *{scroll-behavior:auto}}

/* Account menu in the upper-right toolbar, matching Français Spark. */
.hanzi-workspace{min-width:0}
.account-topbar{min-height:75px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 38px;background:var(--card);border-bottom:1px solid var(--line)}
.account-topbar-label{font-size:.875rem;color:var(--muted);flex-shrink:0}
.topbar-account{display:flex;align-items:center;gap:22px;min-width:0}
.account-topbar .save-status{font-size:.875rem;line-height:1.5;color:var(--muted);overflow-wrap:anywhere;min-width:0}
.account-topbar [data-state="error"]{color:var(--danger)}
.account-menu{position:relative;border:0;padding:0;margin:0;flex-shrink:0}
.account-menu>summary{display:flex;align-items:center;gap:9px;list-style:none;cursor:pointer;font-size:.9375rem;font-weight:650;min-height:44px;white-space:nowrap;color:var(--ink)}
.account-menu>summary::-webkit-details-marker{display:none}
.account-menu>summary:focus-visible,.account-panel button:focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-radius:7px}
.account-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent)}
.account-avatar svg{width:18px;height:18px}.account-chevron{width:16px;height:16px;transition:transform .15s}.account-menu[open] .account-chevron{transform:rotate(180deg)}
.account-panel{position:absolute;right:0;top:calc(100% + 12px);z-index:60;width:410px;max-width:calc(100vw - 30px);max-height:calc(100dvh - 110px);overflow:auto;padding:24px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 15px 65px #17243c26;white-space:normal}
.account-panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.account-panel-heading>div{min-width:0;flex:1}
.account-panel .auth-eyebrow{margin:0 0 8px;font-size:.875rem}.account-panel #active-account{font-size:1.125rem;line-height:1.5;margin:0;overflow-wrap:anywhere}
.account-role{font-size:.875rem;color:var(--muted);margin:6px 0 0;line-height:1.5}
.account-panel-close{display:grid;place-items:center;border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:8px;min-width:36px;min-height:36px;cursor:pointer}.account-panel-close svg{width:18px;height:18px}
.account-panel .account-access{margin:20px 0 0;padding-top:20px}.account-panel .account-access>h3{font-size:1rem}.account-panel .account-access>p{font-size:.9375rem;color:var(--muted);line-height:1.6}
.account-panel .button-row{justify-content:flex-start}.account-panel .invite-member{overflow-wrap:anywhere}.account-panel .invite-member .secondary{font-size:.875rem}
.account-panel .text-button{font-size:.875rem;text-decoration:none;text-align:left;padding:9px 0;color:var(--blue)}
.account-progress-actions{display:grid;gap:4px;border-top:1px solid var(--line);margin-top:20px;padding-top:14px}
.account-signout{margin-top:12px;border-top:1px solid var(--line);padding-top:12px}.account-signout .text-button{color:var(--muted)}
@media(max-width:820px){.account-topbar{min-height:64px;padding:10px 16px}.account-topbar-label{display:none}.topbar-account{width:100%;justify-content:space-between;gap:14px}.account-topbar .save-status{flex:1}.account-panel{padding:20px;max-height:calc(100dvh - 100px)}}
@media(prefers-reduced-motion:reduce){.account-chevron{transition:none}}

.course-navigation[hidden]{display:none!important}
.invite-course-option{display:flex!important;align-items:flex-start;gap:10px;padding:14px;background:var(--accent-soft);border-radius:10px;margin-bottom:16px;cursor:pointer}
.invite-course-option input{width:19px;height:19px;margin:3px 0 0;flex-shrink:0;accent-color:var(--accent)}
.invite-course-option small{font-weight:400;margin-top:4px}
.member-course-switch{display:flex;align-items:center;gap:12px;text-align:left;width:100%;margin-top:14px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit;font-size:.9375rem;font-weight:600;cursor:pointer}
.member-course-switch small{font-weight:400;margin-top:4px;line-height:1.45}
.member-switch-track{width:38px;height:24px;border-radius:14px;background:#8995a8;padding:3px;flex-shrink:0}
.member-switch-track>span{display:block;width:18px;height:18px;border-radius:50%;background:white}
.member-course-switch[aria-checked="true"]{border-color:var(--accent);background:var(--accent-soft)}
.member-course-switch[aria-checked="true"] .member-switch-track{background:var(--accent)}
.member-course-switch[aria-checked="true"] .member-switch-track>span{transform:translateX(14px)}
.member-course-switch:disabled{opacity:.65;cursor:wait}
.account-access .member-help{font-size:.8125rem;font-weight:400;color:var(--muted);line-height:1.5;margin:8px 0 12px}
.member-feedback{font-size:.875rem;line-height:1.5;color:var(--blue);padding:12px;border-radius:8px;background:var(--blue-soft,#eef3fb);margin-top:14px}