/* 1.11 · Language switch (animate-ui "switch" style): a pill with two labels and a knob that glides across; the labels
   cross-fade and the knob squashes on press. Markup: partials/lang_switch.php (IPN) · partials/lang_switch.php (contest). */
.lsw { --lsw-h: 36px; --lsw-bg: rgba(127,127,127,.14); --lsw-knob: #fff; --lsw-ink: inherit; --lsw-on: #111; position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; align-items: center; height: var(--lsw-h); min-width: 92px; padding: 3px; border-radius: 999px; background: var(--lsw-bg); color: var(--lsw-ink); text-decoration: none; isolation: isolate; -webkit-tap-highlight-color: transparent; transition: background-color .2s, box-shadow .2s; }
.lsw:hover { box-shadow: 0 0 0 3px rgba(127,127,127,.12); }
.lsw__k { position: absolute; z-index: 0; top: 3px; bottom: 3px; inset-inline-start: 3px; width: calc(50% - 3px); border-radius: 999px; background: var(--lsw-knob); box-shadow: 0 2px 8px rgba(0,0,0,.18); transition: transform .42s cubic-bezier(.2,.9,.25,1.15), width .2s; }
.lsw.is-en .lsw__k { transform: translateX(100%); } [dir="rtl"] .lsw.is-en .lsw__k { transform: translateX(-100%); }
.lsw:active .lsw__k { width: calc(60% - 3px); } .lsw.is-en:active .lsw__k { transform: translateX(66%); } [dir="rtl"] .lsw.is-en:active .lsw__k { transform: translateX(-66%); }
.lsw__l { position: relative; z-index: 1; display: grid; place-items: center; height: 100%; padding: 0 8px; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; line-height: 1; opacity: .62; transform: translateY(0); transition: opacity .3s, color .3s, transform .3s; white-space: nowrap; }
.lsw__l.is-on { opacity: 1; color: var(--lsw-on); }
.lsw__l small { display: block; font-size: 9px; font-weight: 600; opacity: .7; margin-top: 2px; }
.lsw.is-anim .lsw__l:not(.is-on) { animation: lsw-pop .42s both; } @keyframes lsw-pop { 0% { transform: translateY(0) scale(1); } 40% { transform: translateY(-3px) scale(1.08); } 100% { transform: translateY(0) scale(1); } }
.lsw__g { position: absolute; inset: 0; z-index: 0; border-radius: inherit; background: radial-gradient(60% 120% at var(--x, 50%) 50%, rgba(255,255,255,.25), transparent 70%); opacity: 0; transition: opacity .3s; pointer-events: none; }
.lsw:hover .lsw__g { opacity: 1; }
.lsw--dark, html[data-mode="dark"] .lsw { --lsw-bg: rgba(255,255,255,.1); --lsw-knob: #fff; --lsw-on: #111; }
.lsw--onimage { --lsw-bg: rgba(255,255,255,.14); --lsw-knob: #fff; --lsw-on: #111; color: #fff; }
.lsw--sm { --lsw-h: 30px; min-width: 76px; } .lsw--sm .lsw__l { font-size: 11.5px; padding: 0 6px; }
@media (prefers-reduced-motion: reduce) { .lsw__k, .lsw__l { transition: none; } .lsw.is-anim .lsw__l { animation: none; } }