.lang-switch { position: relative; display: inline-block; text-align: left; z-index: 60; }
.lang-trigger { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 12px; border-radius: 999px; color: #eee; font: inherit; font-weight: 600; cursor: pointer; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 0 0 3px rgba(177,17,22,.1); transition: border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.lang-trigger:hover { border-color: rgba(255,77,77,.45); background: rgba(255,77,77,.07); }
.lang-trigger:focus-visible { outline: 2px solid rgba(255,77,77,.6); outline-offset: 2px; }
.lang-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; padding: 2px 5px; border-radius: 5px; font-size: .66rem; font-weight: 800; letter-spacing: .06em; color: #ff9d9d; background: rgba(255,77,77,.16); border: 1px solid rgba(255,77,77,.25); }
.lang-name { font-size: .9rem; }
.lang-caret { width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-1px); opacity: .8; transition: transform .25s ease; }
.lang-switch[data-open="true"] .lang-caret { transform: rotate(-135deg); }

.lang-menu { position: absolute; right: 0; top: calc(100% + 8px); min-width: 176px; margin: 0; padding: 6px; list-style: none; background: rgba(17,17,21,.98); border: 1px solid rgba(255,255,255,.1); border-radius: 12px; box-shadow: 0 25px 60px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.04); opacity: 0; transform: translateY(-6px) scale(.98); transform-origin: top right; pointer-events: none; transition: opacity .18s ease, transform .18s ease; }
.lang-switch[data-open="true"] .lang-menu { opacity: 1; transform: none; pointer-events: auto; }
.lang-menu li { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 8px; color: #cfd0d8; font-size: .92rem; cursor: pointer; outline: none; transition: background .15s ease, color .15s ease; }
.lang-menu li:hover, .lang-menu li:focus-visible, .lang-menu li.is-active { background: rgba(255,77,77,.12); color: #fff; }
.lang-menu li.is-active { box-shadow: inset 0 0 0 1px rgba(255,77,77,.3); }
.lang-menu li.is-active .lang-badge, .lang-menu li:hover .lang-badge { color: #fff; background: rgba(255,77,77,.3); border-color: rgba(255,77,77,.5); }
.lang-check { margin-left: auto; color: #ff6b6b; opacity: 0; }
.lang-menu li.is-active .lang-check { opacity: 1; }

@media (max-width: 760px) { .lang-menu { right: auto; left: 0; transform-origin: top left; } }
@media (prefers-reduced-motion: reduce) { .lang-menu { transition: opacity .12s ease; transform: none; } }

.status-banner { max-width: 1120px; margin: 28px auto 0; padding: 18px 22px; display: flex; align-items: center; gap: 14px; border: 1px solid rgba(34,197,94,.22); border-radius: 16px; background: rgba(34,197,94,.06); }
.status-banner i { width: 10px; height: 10px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 6px rgba(34,197,94,.1), 0 0 18px #22c55e; }
.status-banner div { display: grid; gap: 4px; }
.status-banner small { color: #aeb0ba; }
.status-banner > b { margin-left: auto; color: #86efac; }

@media (max-width: 760px) { .status-banner { margin-inline: 16px; } .status-banner > b { display: none; } }
