/* The language drawer shares the carved frame with the rest of the RPG controls. */
header{overflow:visible}
header nav{min-width:0}
header .language-picker{position:relative;display:block;flex:none;z-index:45;min-width:128px;min-height:0!important;border:0!important;border-image:none!important;transform:none!important}
header .language-picker:after{content:none!important}
header .language-picker select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%);padding:0!important}
header .language-picker .language-trigger{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:5px;width:100%;min-height:48px;height:100%;white-space:nowrap;padding:4px 18px!important;font-size:14px!important}
.language-name{min-width:0;overflow:hidden;text-overflow:ellipsis}
.language-gear{position:absolute;right:-16px;top:50%;width:32px;height:32px;margin-top:-16px;z-index:6;pointer-events:none;background:url('assets/lift-cog.webp') center/contain no-repeat;filter:sepia(.35) brightness(1.3) drop-shadow(2px 3px 2px #000);transform:rotate(0deg);transition:transform .45s ease-in-out}
.language-chain{position:absolute;right:-5px;top:50%;width:10px;height:0;z-index:5;pointer-events:none;background:url('assets/lift-chain.webp') center top/10px 26px repeat-y;filter:drop-shadow(2px 1px 2px #000);transition:height .24s ease-out}
.language-chevron{transition:transform .2s ease;color:#ffcc82}
.language-picker.open .language-chevron{transform:rotate(180deg)}
.language-picker.open .language-gear{transform:rotate(220deg)}
.language-picker.open .language-chain{height:calc(var(--language-drop,280px) + 24px)}
header .language-menu{position:absolute;top:calc(100% - 2px);right:0;left:0;width:100%;padding:12px 4px 10px;border:13px solid transparent;border-image:var(--rpg-frame-idle) 62 104 62 104 fill / 13px 18px / 0 stretch;background:#180e10;box-shadow:0 18px 25px #050203dd;z-index:4;transform-origin:top center;animation:language-unfold .24s ease-out both}
.language-picker.closing .language-menu{animation:language-unfold .24s ease-in reverse both;pointer-events:none}
@keyframes language-unfold{from{opacity:0;transform:translateY(-8px) scaleY(.85)}to{opacity:1;transform:translateY(0) scaleY(1)}}
header .language-menu .language-option{display:block;width:100%;min-height:38px;margin:0;padding:5px 11px!important;text-align:left;white-space:nowrap;border:0!important;border-image:none!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#f3d9af!important;font:700 14px/1.25 system-ui,sans-serif!important;transform:none!important;filter:none!important}
header .language-menu .language-option:hover,header .language-menu .language-option:focus-visible{background:#512420!important;color:#fff2ce!important;outline:1px solid #d19a5e!important;outline-offset:-2px!important}
header .language-menu .language-option[aria-checked="true"]{color:#ffbf77!important;background:linear-gradient(90deg,#8c271c77,transparent)!important}
header .language-menu .language-option[aria-checked="true"]:before{content:'✦';margin-right:7px;color:#ff7050}
@media(max-width:700px){
 header{height:auto!important;min-height:0!important;display:grid!important;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;align-content:start;gap:3px!important;padding:5px 8px 7px!important}
 header>a{justify-self:start;min-width:0;line-height:0}
 header img{width:76px!important;height:auto}
 header nav{width:100%;max-width:none!important;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;justify-content:stretch;gap:3px!important;padding-right:16px;flex-wrap:nowrap!important}
 header nav:has(> :nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
 header nav>button,header nav>a,header .language-picker{box-sizing:border-box;min-width:0;width:100%;margin:0!important}
 header nav>button,header nav>a{display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.08!important;min-height:50px!important;padding:4px 2px!important;font-size:clamp(10px,2.9vw,13px)!important;overflow-wrap:anywhere;border-width:9px!important;border-image-width:9px 10px!important}
 header .language-picker .language-trigger{min-width:0;min-height:50px!important;gap:2px;padding:4px 7px!important;font-size:clamp(10px,2.9vw,13px)!important;border-width:9px!important;border-image-width:9px 10px!important}
 .language-gear{width:28px;height:28px;right:-14px;margin-top:-14px}
 .language-chain{right:-5px}
 header .language-menu{right:0;left:0;width:100%}
}
@media(prefers-reduced-motion:reduce){.language-menu{animation:none!important}.language-gear,.language-chain,.language-chevron{transition:none}}

/* Once the journey starts, navigation has one destination. */
body[data-nav-mode="journey"] header .language-picker{display:none!important}
body[data-nav-mode="journey"] header nav{grid-template-columns:minmax(0,1fr)!important;padding-right:0}
@media(pointer:coarse) and (max-width:1100px){
 .standalone-halls.phone-ui header .language-picker{display:none!important}
 .standalone-halls.phone-ui header nav{grid-template-columns:minmax(0,1fr)!important;padding-right:0}
}

body[data-scene="gates"] header #backToLobby{display:none!important}

/* Every navigation action shares one height, including the language mechanism. */
header nav{align-items:stretch}
header nav>button:not([hidden]),header nav>a:not([hidden]),header .language-trigger{min-height:50px!important;height:100%;box-sizing:border-box}
header .language-picker{align-self:stretch}
header .language-picker .language-trigger{z-index:8}
header .language-menu{max-height:min(360px,70svh);overflow-y:auto;overscroll-behavior:contain}
body[data-scene="gates"] header,body:has(#arena.active) header{display:none!important}

/* The single exit remains a compact top navigation control on phones. */
body[data-nav-mode="journey"] header nav{display:flex!important;width:auto!important;justify-content:flex-end;align-items:flex-start;justify-self:end}
body[data-nav-mode="journey"] header #backToLobby{width:auto!important;max-width:240px;height:auto!important;min-height:48px!important;padding:6px 20px!important;white-space:normal}
@media(max-width:700px){body[data-nav-mode="journey"] header{grid-template-columns:auto minmax(0,1fr)!important;grid-template-rows:auto!important;align-items:start}body[data-nav-mode="journey"] header #backToLobby{font-size:12px!important;max-width:190px}}