/* Language picker and right-to-left support for link.stonkbuilder.com (app/link_i18n.py). */
.lang-picker{position:relative;display:inline-block;font-size:13px;line-height:1.2}
.lang-picker>summary{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:7px 11px;border:1px solid var(--lm-line,var(--line,rgba(127,127,127,.35)));border-radius:999px;cursor:pointer;list-style:none;white-space:nowrap;color:inherit;background:transparent;user-select:none}
.lang-picker>summary::-webkit-details-marker{display:none}
.lang-picker>summary::after{content:"";width:6px;height:6px;margin-inline-start:2px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.6}
.lang-picker[open]>summary::after{transform:rotate(-135deg) translateY(-1px)}
.lang-picker>summary:focus-visible{outline:3px solid #769d4b;outline-offset:3px}
.lang-globe{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;opacity:.75}
.lang-menu{position:absolute;z-index:40;inset-inline-end:0;top:calc(100% + 8px);min-width:190px;max-height:min(70vh,460px);overflow-y:auto;margin:0;padding:6px;list-style:none;border:1px solid var(--lm-line,var(--line,rgba(127,127,127,.3)));border-radius:14px;background:var(--lm-paper,var(--bg,#fff));box-shadow:0 18px 40px rgba(20,30,20,.16)}
.lang-menu a{display:block;padding:9px 12px;border-radius:9px;color:inherit;text-decoration:none;white-space:nowrap;text-align:match-parent}
.lang-menu a:hover,.lang-menu a:focus-visible{background:rgba(127,127,127,.12)}
.lang-menu a[aria-current="true"]{font-weight:750}
.lang-menu a[aria-current="true"]::after{content:" ✓";opacity:.7}
.lang-menu a[dir="rtl"]{text-align:right}
/* A long list reads better in two columns than as a scrolling one. */
.lang-menu:has(li:nth-child(9)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:2px;min-width:min(310px,calc(100vw - 32px))}
/* Marketing header */
.lang-marketing{color:var(--lm-muted,#637063)}
.lang-marketing>summary{background:#fff}
/* Link pages: a pill fixed in the top-right corner (top-left in right-to-left pages). */
.lang-corner{position:fixed;z-index:45;top:max(12px,env(safe-area-inset-top));inset-inline-end:max(12px,env(safe-area-inset-right))}
.lang-corner .lang-picker>summary{background:var(--surface,var(--lm-paper,#fff));color:var(--ink,inherit);font-weight:700;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.lang-corner .lang-menu{color:var(--ink,inherit);text-align:start}
.lang-code{font-size:12.5px;font-weight:800;letter-spacing:.03em}
/* Right-to-left pages (Arabic, Urdu) */
[dir="rtl"] body{text-align:right}
[dir="rtl"] .lm-parent-link{padding-left:0;padding-right:22px;border-left:0;border-right:1px solid var(--lm-line)}
[dir="rtl"] .lm-mini-card.shift{transform:translateX(-36px)}
[dir="rtl"] .lm-footer-bottom span{margin-right:0;margin-left:auto}
[dir="rtl"] .lm-checklist span{margin-left:0;margin-right:8px}
[dir="rtl"] .tile-go,[dir="rtl"] .ic-arrow{transform:scaleX(-1)}
[dir="rtl"] .lm-diagram,[dir="rtl"] .lm-ecosystem,[dir="rtl"] code,[dir="rtl"] .address-value,[dir="rtl"] input[type="email"],[dir="rtl"] input[type="search"],[dir="rtl"] #share-url{direction:ltr}
[dir="rtl"] .lm-hero-actions,[dir="rtl"] .lm-link-row{justify-content:flex-start}
@media(max-width:720px){.lang-marketing>summary span{display:none}.lang-marketing>summary{padding:7px 9px}}
@media(max-width:360px){.lang-marketing>summary{padding-inline:8px}}
@media(max-width:720px){.lang-marketing[open] .lang-menu{position:fixed;top:64px;inset-inline-end:12px}}
@media(max-width:720px){[dir="rtl"] .lm-mini-card.shift{transform:none}}
/* Community pages (app/community_i18n.py): the top bar's last control; the theme's own colours. */
.site-header>.lang-community,.topbar-inner>.lang-community{flex:none}
.topbar-inner>.lang-community{margin-inline-start:10px}
.lang-community>summary{color:var(--muted,inherit);border-color:var(--line,rgba(127,127,127,.35))}
.lang-community .lang-menu,.lang-content .lang-menu{background:var(--panel,var(--bg,#fff));color:var(--text,inherit);border-color:var(--line,rgba(127,127,127,.3))}
@media(max-width:680px){.site-header>.menu-toggle{margin-inline-start:auto}.lang-community>summary .lang-globe{display:none}}
/* The www guides (app/www_content_i18n.py): the header's last control and the versions in the footer. */
.site-head .lang-content{flex:none;margin-inline-start:8px}
.lang-content>summary{min-height:34px;padding:6px 10px;color:var(--muted,inherit);border-color:var(--line,rgba(127,127,127,.35))}
.content-languages{display:flex;flex-wrap:wrap;gap:6px 14px;flex-basis:100%}
@media(max-width:640px){.lang-content>summary .lang-globe{display:none}.lang-content>summary{padding:6px 8px}}
/* An open menu sits above the page's own floating controls (the Community theme switch is at z-index 1000). */
:is(.lang-corner,.site-header,.site-head,.topbar):has(.lang-picker[open]){z-index:1001}
/* The $STONKB top bar on a phone: the menu takes the breadcrumb's place (the brand still links home). */
@media(max-width:480px){.topbar-inner:has(>.lang-community) :is(.crumb,.crumb-current){display:none}}
/* Korean breaks lines between words, not inside them (the page CSS may not say so). */
:lang(ko) body{word-break:keep-all;overflow-wrap:anywhere}
/* A guide header makes room for the language menu.  Its links sit closer together.  In a translation (longer
   words), and in English below 1181px, the $STONKB button drops its caption and the header drops Whitepaper and
   Link pages (both are in the footer).  Below 1025px it keeps only the buttons, as the page does on phones.  On a
   phone it drops "Open StonkScope" (the page hides it only below 381px), the spacing, the menu's arrow and last
   the $STONKB button.  Should the links still not fit, the nav scrolls sideways inside the header instead of
   widening the page; the brand and the menu keep their place. */
.site-head:has(.lang-content) .site-nav{min-width:0;overflow-x:auto;scrollbar-width:none}
.site-head:has(.lang-content) .site-nav::-webkit-scrollbar{display:none}
.site-head:has(.lang-content) .brand{flex:none}
html:not([lang="en"]) .site-head:has(.lang-content) .site-nav .stonkb-token-cta span{display:none}
.site-head:has(.lang-content) .site-nav a:not(.cta):not(.stonkb-token-cta){padding-inline:8px}
html:not([lang="en"]) .site-head:has(.lang-content) .site-nav :is(a[href$="#whitepaper"],a[href^="https://link.stonkbuilder.com"]){display:none}
@media(max-width:1180px){.site-head:has(.lang-content) .site-nav .stonkb-token-cta span{display:none}
  .site-head:has(.lang-content) .site-nav :is(a[href$="#whitepaper"],a[href^="https://link.stonkbuilder.com"]){display:none}}
@media(max-width:1024px){.site-head:has(.lang-content) .site-nav a:not(.cta):not(.stonkb-token-cta){display:none}}
@media(max-width:480px){.site-head:has(.lang-content) .site-nav .cta{display:none}
  .site-head:has(.lang-content) .site-nav .stonkb-token-cta{margin-inline:0}.site-head .lang-content{margin-inline-start:0}}
@media(max-width:400px){.site-head .lang-content>summary::after{display:none}}
@media(max-width:374px){.site-head:has(.lang-content) .site-nav .stonkb-token-cta{display:none}}
/* In a translation, a long word (Russian, Malay …) in a headline or a button wraps instead of widening the page. */
html:not([lang="en"]) :is(h1,h2,h3){overflow-wrap:anywhere;hyphens:auto}
html:not([lang="en"]) body:has(.lang-community) :is(.button,.text-link){white-space:normal;max-width:100%}
/* The Community header above its phone menu (681px and up): the links sit closer and, should they still not
   fit next to the language menu, scroll sideways inside the header. */
@media(min-width:681px){.site-header:has(>.lang-community) .site-nav{min-width:0;overflow-x:auto;scrollbar-width:none}
  .site-header:has(>.lang-community) .site-nav::-webkit-scrollbar{display:none}
  .site-header:has(>.lang-community) :is(.brand,.site-nav>*){flex:none}}
@media(min-width:681px) and (max-width:1024px){.site-header:has(>.lang-community) .site-nav{gap:12px}}
@media(max-width:360px){.lang-community>summary{padding-inline:8px}}
/* On a phone an open language menu sits inside the screen, whatever the menu's place in its bar (sign-up
   pages wrap it to the start of theirs, and a 16-language menu is wider than the space beside it). */
@media(max-width:480px){.lang-picker[open] .lang-menu{position:fixed;top:64px;inset-inline:12px;min-width:0;max-height:calc(100vh - 88px)}}
/* A Link call-to-action on a phone: a longer translated label wraps inside the button instead of widening the page. */
@media(max-width:720px){.lm-button{white-space:normal;max-width:100%;text-align:center}}
/* The Link header on a wide screen (its links show above 1180px) makes room for the language menu: its
   "StonkBuilder" link goes (it is in the menu and the footer); a translation (longer words) keeps the compact
   Menu button up to 1440px and sets its links closer above that; English shows the menu's globe without the
   language name up to 1280px.  Should the links still not fit, they scroll sideways inside the header instead
   of pushing the buttons and the menu off the page. */
@media(min-width:1181px){.lm-header>.lm-nav{gap:18px;min-width:0;overflow-x:auto;scrollbar-width:none}
  .lm-header>.lm-nav::-webkit-scrollbar{display:none}
  .lm-header>.lm-nav>*,.lm-header>:not(.lm-nav){flex:none}
  .lm-header:has(.lang-marketing) .lm-parent-link{display:none}
  html:not([lang="en"]) .lang-marketing>summary span{display:none}
  html:not([lang="en"]) .lang-marketing>summary{padding:7px 9px}}
@media(min-width:1181px) and (max-width:1280px){.lang-marketing>summary span{display:none}.lang-marketing>summary{padding:7px 9px}}
@media(min-width:1181px) and (max-width:1440px){html:not([lang="en"]) :is(.lm-header:has(.lang-marketing) .lm-nav,.lm-header:has(.lang-marketing) .lm-login){display:none}
  html:not([lang="en"]) .lm-header:has(.lang-marketing) .lm-actions{margin-inline-start:auto}
  html:not([lang="en"]) .lm-header:has(.lang-marketing) .lm-menu{display:block}
  html:not([lang="en"]) .lm-mobile-nav{padding:9px 30px 18px;background:#fff;border-bottom:1px solid var(--lm-line);box-shadow:0 10px 25px rgba(35,56,36,.08)}
  html:not([lang="en"]) .lm-mobile-nav.open{display:flex;flex-direction:column;gap:3px}
  html:not([lang="en"]) .lm-mobile-nav a{padding:11px 0;color:#657364;font-size:14px}}
@media(min-width:1441px){html:not([lang="en"]) .lm-header>.lm-nav{gap:14px;font-size:13px}}