/* the language menus (js/langmenu.js): a pill in the top bar, a link in the small print, the choices on Polly's card */
.lang-wrap { position: relative; display: inline-flex; }
.lang-btn { display: inline-flex; align-items: center; gap: 6px; }
.lang-btn svg, .lang-links svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.lang-globe { width: 18px; height: 18px; }
.lang-chev { width: 14px; height: 14px; opacity: .55; transition: transform .15s; }
.lang-btn[aria-expanded="true"] .lang-chev { transform: rotate(180deg); }
.lang-list {
  position: absolute; top: calc(100% + 8px); right: 0; margin: 0; padding: 6px; list-style: none; min-width: 170px;
  background: var(--panel, #f6efdc); border: 1px solid var(--line-2, rgba(51, 41, 31, .25)); border-radius: 12px;
  box-shadow: var(--shadow, 0 8px 24px rgba(40, 30, 15, .18)); z-index: 60;
}
.lang-list li { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 9px 12px; border-radius: 8px; cursor: pointer; font: 600 14px var(--sans, sans-serif); color: var(--ink, #33291f); white-space: nowrap; }
.lang-list li small { font: 700 11px var(--sans, sans-serif); letter-spacing: .08em; color: var(--ink-3, #7a6a55); }
.lang-list li:hover, .lang-list li:focus { background: rgba(51, 41, 31, .08); outline: none; }
.lang-list li[aria-selected="true"], .lang-list li[aria-selected="true"] small { color: var(--red, #a3352c); }

/* the top bar's pill: the last on the right, like the other pills */
.lang-pill { border-radius: 999px; }
.lang-pill .lang-btn { height: 50px; padding: 0 13px; border: 0; border-radius: 999px; background: none; font: 800 14px var(--sans, sans-serif); letter-spacing: .06em; color: var(--ink, #33291f); }
.lang-pill .lang-btn:hover { background: #fffaf0; }
.lang-pill .lang-globe { width: 20px; height: 20px; color: var(--red, #a3352c); }
/* on a phone the top bar moves to the bottom: the pill stays top right, a gap under the compass rose and as wide as
   it (the right column of style.css's phone frame), at the end of the search's row and as tall as the search */
.lang-pill.floating { position: absolute; z-index: 7; top: var(--ph-search-top, 84px); right: var(--ph-right, 12px); background: var(--panel, #f6efdc); border: 1px solid var(--line-2, rgba(51, 41, 31, .25)); box-shadow: var(--shadow, 0 8px 24px rgba(40, 30, 15, .18)); transition: opacity .25s; }
.lang-pill.floating .lang-btn { height: calc(var(--ph-tap, 44px) - 2px); width: calc(var(--ph-col, 64px) - 2px); padding: 0; justify-content: center; gap: 5px; font-size: 13px; }
.lang-pill.floating .lang-chev { display: none; }
.lang-pill.floating .lang-globe { width: 18px; height: 18px; }
.drawer-open .lang-pill.floating, .room-open .lang-pill.floating { opacity: 0; pointer-events: none; }
/* in a full-screen page's own bar (the Academy), sized like its buttons */
.lang-pill.lang-bar { background: var(--panel, #f6efdc); border: 1px solid var(--line-2, rgba(51, 41, 31, .25)); }
.lang-pill.lang-bar .lang-btn { height: 34px; padding: 0 10px; font-size: 13px; }
.lang-pill.lang-bar .lang-globe { width: 17px; height: 17px; }
@media (max-width: 560px) { .lang-pill.lang-bar .lang-chev { display: none; } .lang-pill.lang-bar .lang-btn { padding: 0 8px; } }

/* the small print under the scale: opens upwards */
.imprint .lang-btn { gap: 4px; }
.imprint .lang-btn .lang-globe { width: 12px; height: 12px; }
.imprint .lang-chev { display: none; }
.imprint .lang-list { top: auto; bottom: calc(100% + 6px); left: 0; right: auto; min-width: 150px; }

/* Polly's first card: every language, the current one marked */
.lang-links { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 12px 0 0; padding-top: 10px; border-top: 1px dashed var(--line-2, rgba(51, 41, 31, .25)); color: var(--ink-3, #7a6a55); }
.lang-links .lang-globe { width: 16px; height: 16px; color: var(--red, #a3352c); }
.lang-links .link-btn { font-size: 13px; }
.lang-links .link-btn[aria-current] { color: var(--red, #a3352c); text-decoration: none; cursor: default; }