/* Language menu shared by all independent OATE tools. No global reset. */
.oate-menu-toggle {
  display:flex; flex-direction:column; justify-content:center; gap:5px;
  width:42px; height:42px; min-width:42px; margin-left:16px;
  padding:12px; border:1px solid rgba(255,255,255,.23);
  color:#f1f0ec; background:rgba(10,10,10,.68); cursor:pointer;
}
.oate-menu-toggle span {display:block; height:1px; background:currentColor; transition:transform .2s,opacity .2s;}
.oate-menu-toggle.open span:first-child {transform:translateY(6px) rotate(45deg);}
.oate-menu-toggle.open span:nth-child(2) {opacity:0;}
.oate-menu-toggle.open span:last-child {transform:translateY(-6px) rotate(-45deg);}
/* Keep each app's original header positioning (absolute/fixed/relative). */
.oate-header {isolation:isolate;}
.oate-site-menu {
  position:absolute; z-index:900;
  right:clamp(16px,4vw,72px); top:calc(100% - 8px);
  width:min(290px, calc(100vw - 32px)); padding:12px;
  border:1px solid #484848; background:#171717; color:#f5f5f5;
  box-shadow:0 16px 40px rgba(0,0,0,.48);
}
.oate-site-menu[hidden] {display:none !important;}
.oate-site-menu > a {display:block; padding:10px 12px; font:12px/1.5 Consolas,'Helvetica Neue',sans-serif; color:#f5f5f5; text-decoration:none;}
.oate-site-menu > a:hover {background:#2e2e2e;}
.oate-site-menu .site-language-control {padding:12px; border-top:1px solid #444; margin-top:8px;}
.oate-site-menu .site-language-control label {display:block; margin-bottom:8px; color:#ddd; font-size:12px;}
.oate-site-menu .site-language-select {width:100%; padding:10px; color:#fff; background:#171717; border:1px solid #777; font-size:14px;}
.oate-site-menu .site-language-select option {background:#171717; color:#fff;}
.oate-menu-toggle:focus-visible, .oate-site-menu select:focus-visible {outline:2px solid #fff; outline-offset:2px;}
/* The car converter uses a separate minimal header rather than an .oate-header. */
.oate-site-nav {position:fixed; z-index:500; top:8px; right:16px; display:flex; justify-content:flex-end;}
.oate-site-nav .oate-site-menu {right:0; top:48px;}
.site-translation-notice {position:relative; z-index:2; margin:14px auto; max-width:960px; padding:12px 16px; color:#222; background:#f3f3f3; border-left:3px solid #888; font-size:13px;}
@media(max-width:720px) { .oate-header .oate-header-nav {display:none;} .oate-header .oate-menu-toggle {margin-left:auto;} }
@media(prefers-reduced-motion:reduce) { .oate-menu-toggle span {transition:none;} }