/* One header row, on the same grid as the banner and study cards. */
body{--page-width:1240px;--page-gutter:28px}
body:has(#workspace[data-view=library]){--page-width:1680px}
body:has(#workspace) .site-header{display:flex!important;align-items:center;flex-wrap:nowrap;gap:24px;width:100%;max-width:var(--page-width);box-sizing:border-box;margin:0 auto;padding:18px var(--page-gutter);min-height:88px;background:transparent;border:0;box-shadow:none}
.site-header .brand{display:inline-flex;flex:none;align-items:center;gap:10px;margin:0;text-decoration:none;filter:drop-shadow(0 1px 0 #ffffff8c)}
.site-header .brand-mark{width:36px;height:44px;background:none;border-radius:0}
.site-header .brand-wordmark{display:flex;align-items:baseline;font-size:30px;letter-spacing:-1px}
.site-header .brand-wordmark span{margin:0;font-size:inherit;color:#17483e}
.site-header .brand-lingo{font-weight:450}
[data-theme=dark] .site-header .brand-wordmark span{color:#ecfff5}
[data-theme=dark] .site-header .brand{filter:drop-shadow(0 1px 1px #0009)}
#workspace,#workspace[data-view=library]{box-sizing:border-box;padding-inline:var(--page-gutter)}
.site-header .home-language-settings.home-language-visible{display:block;flex:0 1 400px;order:0;width:auto;min-width:0;max-width:400px;margin:0 0 0 auto;padding:0;border:0;border-radius:0;background:transparent}
.site-header .home-language-visible .language-pair{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);gap:12px;align-items:center;width:100%;padding:0;margin:0;border:0;background:transparent}
.home-language-visible .language-readiness-copy{display:none!important}
.site-header .home-language-visible .site-language{display:grid;grid-template-columns:minmax(0,1fr) 36px;grid-template-rows:20px 44px;gap:2px;min-width:0}
.home-language-visible .site-language>span{grid-column:1/-1;grid-row:1;font-size:14px;color:var(--muted)}
.home-language-visible .site-language>select{grid-column:1;grid-row:2;width:100%;min-width:0;max-width:none;min-height:44px;padding:8px 10px;font-size:16px;border-radius:10px}
.home-language-visible .site-language>.language-search-trigger{grid-column:2;grid-row:2;min-width:36px;min-height:44px;padding:0}
.site-header .home-language-visible .site-language:has(select.language-flag-select){grid-template-columns:minmax(0,1fr)}
.site-header .home-language-visible select.language-flag-select{padding-inline-start:38px}
.site-header .home-language-visible .language-arrow{align-self:end;height:44px;padding:0}
.site-header .language-line-navigation{display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto;flex-basis:auto;flex-wrap:nowrap;gap:4px;order:0;width:auto;max-width:none;padding:0;margin:0;border:0;overflow:visible}
.site-header .language-line-navigation .nav-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;flex-direction:row;gap:7px;width:auto;min-width:44px;min-height:50px;margin:0;padding:8px 10px;font-size:18px;line-height:1.35;white-space:nowrap;border:0!important;border-radius:14px;background:transparent;box-shadow:none!important;color:var(--muted)}
.language-line-navigation .nav-button:is(.active,[aria-current=page]){background:var(--active)!important;color:var(--pine)!important}
.language-line-navigation .nav-button:hover{background:var(--soft)}
.site-header .language-line-navigation .nav-button svg{width:25px;height:25px;flex:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.site-header .language-line-navigation .profile-menu{order:0}
.site-header .language-line-navigation .nav-button>span{display:inline!important;position:static;width:auto;height:auto;margin:0;padding:0;overflow:visible;clip-path:none}
.language-line-navigation [hidden],.forest-banner-brand{display:none!important}
.site-utility-footer:has(>.connection-location:empty){display:none}
body:has(#load-state:not([hidden])) .home-language-settings,body:has(#load-state:not([hidden])) .language-line-navigation,body:has(#load-state:not([hidden])) .site-utility-footer{display:none!important}
body[data-view=studio] .home-language-settings,body[data-view=studio] .language-line-navigation{display:none!important}
@media(max-width:1080px){
 body:has(#workspace) .site-header{display:grid!important;grid-template-columns:auto minmax(0,1fr);gap:10px 16px;padding-block:12px}
 .site-header .brand{grid-column:1;grid-row:1}
 .site-header .language-line-navigation{grid-column:2;grid-row:1;justify-self:end}
 .site-header .home-language-settings.home-language-visible{grid-column:1/-1;grid-row:2;justify-self:end;width:400px;max-width:100%;margin:0}
 body[data-view=studio] .site-header,body:has(#load-state:not([hidden])) .site-header{grid-template-columns:1fr}
}
@media(max-width:760px){
 body{--page-gutter:18px}
 body:has(#workspace) .site-header{gap:10px 8px}
 .site-header .brand{gap:8px}
 .site-header .brand-mark{width:30px;height:36px}
 .site-header .brand-wordmark{font-size:24px}
 .site-header .home-language-settings.home-language-visible{width:100%;max-width:none}
 .site-header .home-language-visible .language-pair{gap:8px}
 .site-header .language-line-navigation{gap:2px}
 .site-header .language-line-navigation .nav-button{flex-direction:column;gap:2px;min-width:48px;min-height:52px;padding:4px;font-size:16px;line-height:20px;border-radius:10px}
 .site-header .language-line-navigation .nav-button svg{width:21px;height:21px}
 .site-header:has(.game-link) .language-line-navigation{grid-column:1/-1;grid-row:2;justify-self:stretch;display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:4px;width:100%}
 .site-header:has(.game-link) .language-line-navigation .nav-button{min-width:0;width:100%;max-width:100%;box-sizing:border-box;white-space:normal}
 .site-header:has(.game-link) .language-line-navigation .nav-button>span{white-space:normal;overflow-wrap:anywhere;max-width:100%}
 .site-header:has(.game-link) .home-language-settings.home-language-visible{grid-row:3}
}
@media(max-width:420px){.site-header .brand{gap:6px}.site-header .brand-mark{width:28px;height:34px}.site-header .brand-wordmark{font-size:22px}}
@media(max-width:380px){body{--page-gutter:12px}}
