.language-picker{
  --language-bg:rgba(255,255,255,.96);
  --language-trigger:rgba(255,255,255,.72);
  --language-border:rgba(121,153,204,.3);
  --language-ink:#14213a;
  --language-muted:#71819b;
  --language-hover:#edf4ff;
  --language-accent:#2f63ff;
  position:relative;
  z-index:30;
  flex:0 0 auto;
  color:var(--language-ink);
}
.language-picker__trigger{
  width:40px;
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:1px solid var(--language-border);
  border-radius:8px;
  color:var(--language-ink);
  background:var(--language-trigger);
  box-shadow:0 8px 24px rgba(47,99,255,.08);
  backdrop-filter:blur(14px);
  cursor:pointer;
  transition:border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
}
.language-picker__trigger svg{width:19px;height:19px;display:block}
.language-picker__trigger:hover,.language-picker.is-open .language-picker__trigger{
  color:var(--language-accent);
  border-color:rgba(47,99,255,.42);
  background:var(--language-bg);
  box-shadow:0 10px 28px rgba(47,99,255,.15);
}
.language-picker__trigger:focus-visible,.language-picker__option:focus-visible{
  outline:2px solid var(--language-accent);
  outline-offset:2px;
}
.language-picker__menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  width:248px;
  max-width:calc(100vw - 24px);
  padding:8px;
  border:1px solid var(--language-border);
  border-radius:8px;
  background:var(--language-bg);
  box-shadow:0 18px 46px rgba(27,48,87,.2);
  backdrop-filter:blur(22px);
  transform-origin:top right;
  animation:language-menu-in .16s ease-out;
}
.language-picker[data-language-placement="top"] .language-picker__menu{
  top:auto;
  bottom:calc(100% + 10px);
  transform-origin:bottom left;
}
.language-picker__title{
  display:block;
  padding:7px 8px 9px;
  color:var(--language-muted);
  font-size:12px;
  font-weight:700;
  line-height:1;
}
.language-picker__option{
  width:100%;
  min-height:58px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 18px;
  align-items:center;
  gap:10px;
  padding:7px 9px;
  border:0;
  border-radius:6px;
  color:var(--language-ink);
  background:transparent;
  text-align:left;
  cursor:pointer;
}
.language-picker__option:hover{background:var(--language-hover)}
.language-picker__option[aria-checked="true"]{background:var(--language-hover)}
.language-picker__code{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--language-border);
  border-radius:6px;
  color:var(--language-muted);
  background:rgba(255,255,255,.58);
  font-size:11px;
  font-weight:800;
  line-height:1;
}
.language-picker__option[aria-checked="true"] .language-picker__code{
  color:#fff;
  border-color:var(--language-accent);
  background:var(--language-accent);
}
.language-picker__copy{min-width:0;display:block}
.language-picker__copy strong,.language-picker__copy small{display:block;letter-spacing:0}
.language-picker__copy strong{font-size:14px;line-height:1.2}
.language-picker__copy small{margin-top:4px;color:var(--language-muted);font-size:11px;font-weight:500;line-height:1.2}
.language-picker__check{width:17px;height:17px;color:var(--language-accent);opacity:0}
.language-picker__option[aria-checked="true"] .language-picker__check{opacity:1}
body[data-auth-page="login"] .language-picker,
body[data-auth-page="register"] .language-picker{
  --language-bg:rgba(10,15,26,.97);
  --language-trigger:rgba(10,15,26,.78);
  --language-border:rgba(255,255,255,.12);
  --language-ink:#f8fafc;
  --language-muted:#94a3b8;
  --language-hover:rgba(59,130,246,.13);
  --language-accent:#3b82f6;
}
body[data-auth-page="login"] .form-side>.language-picker,
body[data-auth-page="register"] .form-side>.language-picker{
  position:absolute;
  top:24px;
  right:24px;
  z-index:4;
}
body[data-auth-page="login"] .language-picker__code,
body[data-auth-page="register"] .language-picker__code{background:rgba(255,255,255,.05)}
body[data-auth-page="h5"] .auth-brand>.language-picker{margin-left:auto}
@keyframes language-menu-in{
  from{opacity:0;transform:translateY(-4px) scale(.98)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@media (prefers-reduced-motion:reduce){.language-picker__menu{animation:none}}
@media (max-width:340px){
  body[data-auth-page="h5"] .language-picker__trigger{width:38px;height:38px}
  body[data-auth-page="h5"] .language-picker__menu{width:236px}
}