/* Shared by generated public pages and the signup screens. */
[dir='rtl'] .guide-arrow, [dir='rtl'] .guide-entry > span:last-child { transform: scaleX(-1); }
[dir='rtl'] .story-contents { text-align: right; }
[dir='rtl'] .article-body ul, [dir='rtl'] .article-body ol { padding-inline-start: 24px; padding-inline-end: 0; }
[dir='rtl'] .smokie-auth-legal { text-align: center; }
[dir='rtl'] input[type='tel'], [dir='rtl'] input[autocomplete='one-time-code'] { direction: ltr; text-align: start; }
@media (max-width: 600px) {
  .marketing > nav, body > nav { flex-wrap: wrap; gap: 12px; }
}

.smokie-welcome-legal { margin: 20px 0 0; max-width: 400px; color: #fff; font: 12px/1.6 system-ui, sans-serif; text-align: center; }
.smokie-matching-number { direction: ltr; }
/* Native compound words can exceed a phone's heading width. Prefer the
   language's hyphenation rules, with wrapping as a fallback. */
html:not([lang='en']) :is(h1, h2, h3) { hyphens: auto; overflow-wrap: anywhere; }
/* Longer translations and Hebrew word order need a separate icon column. */
html:not([lang='en']) .smokie-auth .smokie-auth-buttons .smokie-auth-button { display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 20px; justify-content: initial; padding: 12px 23px; font-size: 16px; }
html:not([lang='en']) .smokie-auth-buttons .smokie-auth-button > svg { position: static; width: 22px; height: 25px; }
html:not([lang='en']) .smokie-auth-buttons .smokie-auth-button > span { width: auto; white-space: normal; text-align: start; }
html:not([lang='en']) .smokie-auth-buttons .smokie-auth-button > .smokie-auth-spinner { position: static; width: 19px; height: 19px; }
html:not([lang='en']) .smokie-auth-buttons .smokie-auth-button::after { left: auto; inset-inline-start: 55px; }
[dir='rtl'] .smokie-phone-flow, [dir='rtl'] .smokie-auth .smokie-phone-flow h2, [dir='rtl'] .smokie-auth .smokie-phone-field { text-align: start; }
@media (min-width: 900px) and (max-width: 1150px) {
  .smokie-app[lang]:not([lang='en']) .smokie-header { gap: clamp(8px, 1.5vw, 18px); }
  .smokie-app[lang]:not([lang='en']) .smokie-nav { gap: clamp(10px, 1.2vw, 16px); }
  .smokie-app[lang]:not([lang='en']) .smokie-nav button { font-size: 16px; }
}