:host{display:inline-block;--ba1: #DFE5EF;--ba2: #b8c9e2;--ba3: #A1B2C0;--ba4: #001ba2;--ba5: #2b6c9a;--ba6: #132e65;--ba7: #062A3D;--ba8: #2f8f9d;--ba9: #0a4b6f;--ba10: #0a4b6f;--playful: #00b4d8;--playful2: #0fa1c2ff;--feature-high-color: orangered}input{display:none}label{position:relative;display:flex;align-items:center;justify-content:space-between;width:72px;height:32px;padding:0 8px;background:var(--ba2);border:1px solid var(--ba1);border-radius:100px;cursor:pointer;user-select:none;box-sizing:border-box}.lang{font-size:12px;font-weight:400;z-index:2;transition:opacity .2s ease}.knob{position:absolute;top:2px;left:2px;width:26px;height:26px;background:var(--playful2);border-radius:48%;box-shadow:0 2px 6px #0003;transition:transform .25s ease,}input:checked+label .knob{transform:translate(40px)}input:not(:checked)+label .en{opacity:1}input:not(:checked)+label .es{opacity:.7;color:var(--ba6)}input:checked+label .en{opacity:.7;color:var(--ba6)}input:checked+label .es{opacity:1}@media only screen and (max-width: 900px){label{width:48px;height:24px;padding:0 4px}.knob{top:2px;left:2px;width:20px;height:18px}input:checked+label .knob{transform:translate(24px)}}