/* Shared wordmark sizing for every learner-facing page */
.brand-lockup,.top>.brand,.top>.admin-brand,.intro-brand,.toolbar>.brand-lockup{display:flex;align-items:center;gap:10px;flex-shrink:0;text-decoration:none}
.brand-lockup img,.top>.brand img,.top>.admin-brand img,.intro-brand img,.toolbar>.brand-lockup img{display:block;flex:0 0 52px;width:52px;height:52px;max-width:52px;max-height:52px;object-fit:contain;object-position:center;border:0;border-radius:0;background:transparent;padding:0}
.brand-lockup .brand-mark,.top>.brand .brand-mark,.top>.admin-brand .brand-mark,.intro-brand .brand-mark,.toolbar>.brand-lockup .brand-mark{display:block;flex:0 0 52px;width:52px;height:52px;background:url('/uploads/683ea04c6f35d.png') left center/280px 78.4px no-repeat;font-size:0!important;line-height:0!important;flex-direction:initial!important;align-items:initial!important;justify-content:initial!important;padding:0!important;border:0!important;border-radius:0!important}
.brand-lockup .brand-copy,.top>.brand span,.top>.admin-brand span,.intro-brand span,.toolbar>.brand-lockup .brand-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-width:0;white-space:nowrap;line-height:1.2}
.brand-lockup .brand-copy strong,.top>.brand span strong,.top>.admin-brand span strong,.intro-brand span strong,.toolbar>.brand-lockup .brand-copy strong{font-family:"Microsoft YaHei UI","PingFang SC","Noto Sans CJK SC",sans-serif;font-size:16px;line-height:1.25;letter-spacing:.035em;font-weight:700;color:#192e55}
.brand-lockup .brand-copy small,.top>.brand span small,.top>.admin-brand span small,.intro-brand span small,.toolbar>.brand-lockup .brand-copy small{font-family:Arial,"Helvetica Neue",sans-serif;font-size:9px;line-height:1.2;letter-spacing:.12em;font-weight:600;color:#738198;margin:2px 0 0}
.top:has(>.brand-lockup),.top:has(>.brand),.top:has(>.admin-brand){padding-left:max(18px,calc((100vw - 1800px)/2 + 18px));padding-right:max(18px,calc((100vw - 1800px)/2 + 18px))}
@media(max-width:750px){.top:has(>.brand-lockup),.top:has(>.brand),.top:has(>.admin-brand){padding-left:16px;padding-right:16px}.brand-lockup img,.top>.brand img,.top>.admin-brand img,.intro-brand img,.toolbar>.brand-lockup img{flex-basis:46px;width:46px;height:46px;max-width:46px;max-height:46px}.brand-lockup .brand-mark,.top>.brand .brand-mark,.top>.admin-brand .brand-mark,.intro-brand .brand-mark,.toolbar>.brand-lockup .brand-mark{flex-basis:48px;width:48px;height:48px;background-size:240px 67.2px}.brand-lockup .brand-copy strong,.top>.brand span strong,.top>.admin-brand span strong,.intro-brand span strong,.toolbar>.brand-lockup .brand-copy strong{font-size:15px}.brand-lockup .brand-copy small,.top>.brand span small,.top>.admin-brand span small,.intro-brand span small,.toolbar>.brand-lockup .brand-copy small{font-size:8px}}

/* Keep the learner header mark visible and the Chinese/English wordmark aligned as one lockup. */
.brand-lockup,.top>.brand-lockup{display:flex;align-items:center;gap:10px;min-height:60px;flex-shrink:0}
.brand-lockup .brand-mark{flex:0 0 52px;width:52px;height:52px;background-position:left center;background-size:280px 78.4px;background-repeat:no-repeat;overflow:visible}
.brand-lockup .brand-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0;white-space:nowrap;line-height:1.2}
.brand-lockup .brand-copy strong{font-family:'Microsoft YaHei UI','PingFang SC','Noto Sans CJK SC',sans-serif;font-size:16px;line-height:1.25;font-weight:700;letter-spacing:.035em}
.brand-lockup .brand-copy small{font-family:Arial,'Helvetica Neue',sans-serif;font-size:9px;line-height:1.2;letter-spacing:.12em;font-weight:600;margin-top:2px}
@media(max-width:750px){.brand-lockup{gap:8px}.brand-lockup .brand-mark{flex-basis:48px;width:48px;height:48px;background-size:240px 67.2px}.brand-lockup .brand-copy strong{font-size:15px}.brand-lockup .brand-copy small{font-size:8px}}

/* The shield artwork begins 13px into the combined brand sprite. Nudge the
   sprite left so its right edge stays inside the mark box on learner pages. */
.brand-lockup .brand-mark,.top>.brand .brand-mark,.top>.admin-brand .brand-mark,.intro-brand .brand-mark,.toolbar>.brand-lockup .brand-mark{background-position:-3px center!important}