/* Opinbee — Gameall styles + Tailwind v4 preflight (aligned with app) */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0 solid;
}
html {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}
h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}
a {
  color: inherit;
  text-decoration: inherit;
}
b, strong { font-weight: bolder; }
code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 1em;
}
small { font-size: 80%; }
ol, ul, menu { list-style: none; }
img, svg, video, canvas, audio, iframe, embed, object {
  display: block;
  vertical-align: middle;
}
img, video { max-width: 100%; height: auto; }
button, input, select, optgroup, textarea, ::file-selector-button {
  font: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  letter-spacing: inherit;
  color: inherit;
  border-radius: 0;
  background-color: transparent;
  opacity: 1;
}
::placeholder { opacity: 1; }
textarea { resize: vertical; }
::-webkit-search-decoration { -webkit-appearance: none; }
button,
input:where([type='button'], [type='reset'], [type='submit']),
::file-selector-button {
  appearance: button;
}
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}
[hidden]:where(:not([hidden='until-found'])) {
  display: none !important;
}
summary { display: list-item; }

/* ===== Gameall — light token layer (mobile-first) ===== */
:root {
  --gl-bg: #FFFFFF; --gl-soft: #FBF8F1; --gl-line: #ECE6D9; --gl-ink: #0F172A; --gl-body: #334155; --gl-muted: #5B6779;
  /* Brand (logo): honey #F2A900 + navy #0F172A. "--gl-blue*" = accent tokens (names kept): deep honey for text/links (6.3:1 on white, AA). */
  --gl-honey: #F2A900; --gl-honey-dark: #DB9A00; --gl-honey-soft: #FFF5D9;
  --gl-blue: #8A5A00; --gl-blue-dark: #6E4700; --gl-blue-soft: #FFF5D9;
  --gl-green: #0B7A53; --gl-green-soft: #E3F6EE; --gl-gold: #B77800; --gl-gold-soft: #FFF5D9;
  --gl-red: #B42318; --gl-red-soft: #FEE4E2;
  --gl-display: "Sora", "Segoe UI", Helvetica, Arial, sans-serif; --gl-text: "Manrope", "Segoe UI", Helvetica, Arial, sans-serif;
  --gl-radius: 16px; --gl-shadow: 0 10px 30px rgba(15, 23, 42, 0.08); --gl-nav-h: 60px;
}
html { background: var(--gl-bg); color-scheme: light; }
body { margin: 0; background: var(--gl-bg); color: var(--gl-ink); font-family: var(--gl-text); }
.gl { background: var(--gl-bg); color: var(--gl-ink); font-family: var(--gl-text); font-size: 1.0625rem; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: clip; }
.gl img { max-width: 100%; height: auto; display: block; }
.gl a:not(.gl-btn):not(.gl-logo) { color: var(--gl-blue); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.gl-muted { color: var(--gl-muted); }
[id] { scroll-margin-top: calc(var(--gl-nav-h) + 12px); }

.gl-kicker { margin: 0 0 0.75rem; font-family: var(--gl-display); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gl-blue); }
.gl-h1 { margin: 0; font-family: var(--gl-display); font-weight: 800; font-size: clamp(2.1rem, 7.5vw, 3.6rem); line-height: 1.08; letter-spacing: -0.02em; text-wrap: balance; }
.gl-h2 { margin: 0 0 0.8rem; font-family: var(--gl-display); font-weight: 700; font-size: clamp(1.55rem, 5.2vw, 2.3rem); line-height: 1.15; letter-spacing: -0.015em; text-wrap: balance; max-width: 22ch; }
.gl-lead { margin: 0 0 1.5rem; color: var(--gl-body); max-width: 56ch; }

.gl-btn {
  appearance: none; -webkit-appearance: none;
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  min-height: 48px; padding: 0.75rem 1.25rem; border-radius: 999px; border: 1.5px solid transparent;
  font: inherit; font-weight: 700; font-size: 1rem; text-decoration: none; cursor: pointer;
  transition: background 0.18s, transform 0.18s, box-shadow 0.18s;
}
.gl-btn--primary { background: var(--gl-honey); color: var(--gl-ink); box-shadow: 0 6px 18px rgba(219, 154, 0, 0.30); }
.gl-btn--primary:hover { background: var(--gl-honey-dark); transform: translateY(-1px); }
.gl-btn--primary:active { transform: translateY(0); }
.gl-btn--primary:disabled { opacity: 0.65; cursor: wait; transform: none; }
.gl-btn--ghost { background: var(--gl-bg); color: var(--gl-ink); border-color: var(--gl-line); }
.gl-btn--ghost:hover { border-color: var(--gl-ink); }
.gl-btn--lg { min-height: 54px; padding: 0.9rem 1.5rem; font-size: 1.05rem; }
.gl-btn--block { width: 100%; }
.gl-btn--nav { min-height: 40px; padding: 0.5rem 1rem; font-size: 0.92rem; box-shadow: none; }

.gl-nav { position: sticky; top: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; height: var(--gl-nav-h); padding: 0 max(16px, 4vw); background: rgba(255,255,255,0.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--gl-line); }
.gl-logo { display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--gl-display); font-weight: 800; font-size: 1.15rem; color: var(--gl-ink); text-decoration: none; }
.gl-logo__img { display: block; height: 34px; width: 117px; max-width: none; }
.gl-nav__links { display: none; }
.gl-nav__links a { color: var(--gl-body); text-decoration: none; font-weight: 600; font-size: 0.95rem; }
.gl-nav__links a:hover { color: var(--gl-ink); }
.gl-nav__right { display: flex; align-items: center; gap: 0.5rem; }
.gl-burger { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--gl-line); border-radius: 12px; background: var(--gl-bg); cursor: pointer; }
.gl-burger span, .gl-burger span::before, .gl-burger span::after { display: block; width: 18px; height: 2px; background: var(--gl-ink); border-radius: 2px; content: ""; transition: transform 0.2s, background 0.2s; }
.gl-burger span { position: relative; }
.gl-burger span::before { position: absolute; top: -6px; }
.gl-burger span::after { position: absolute; top: 6px; }
.gl-burger[aria-expanded="true"] span { background: transparent; }
.gl-burger[aria-expanded="true"] span::before { transform: translateY(6px) rotate(45deg); }
.gl-burger[aria-expanded="true"] span::after { transform: translateY(-6px) rotate(-45deg); }
@media (max-width: 1023px) {
  .gl-nav__links.is-open { position: fixed; top: var(--gl-nav-h); left: 0; right: 0; display: flex; flex-direction: column; padding: 0.5rem 16px 1rem; background: var(--gl-bg); border-bottom: 1px solid var(--gl-line); box-shadow: var(--gl-shadow); z-index: 39; }
  .gl-nav__links.is-open a { padding: 0.95rem 0.25rem; border-bottom: 1px solid var(--gl-line); font-size: 1.05rem; }
  .gl-nav__links.is-open a:last-child { border-bottom: 0; }
}
@media (max-width: 767px) { .gl-btn--nav { display: none; } }
/* Inline nav only from 1024px: some languages (es, ru, de) have long labels. */
@media (min-width: 1024px) { .gl-nav__links { display: flex; gap: 1.5rem; } .gl-burger { display: none; } }
.gl-skip { position: absolute; left: 16px; top: -100px; z-index: 50; padding: 0.7rem 1rem; border-radius: 10px; background: var(--gl-ink); color: #fff; font-weight: 700; text-decoration: none; }
.gl-skip:focus-visible { top: 8px; }

.gl-hero { display: grid; gap: 1.75rem; padding: 1.75rem max(16px, 4vw) 2.25rem; max-width: 1120px; margin-inline: auto; }
.gl-hero__sub { margin: 1rem 0 0; color: var(--gl-body); font-size: 1.08rem; max-width: 50ch; }
.gl-hero__actions { display: grid; gap: 0.6rem; margin-top: 1.4rem; }
.gl-hero__note { display: flex; gap: 0.45rem; align-items: flex-start; margin: 0.9rem 0 0; font-size: 0.86rem; color: var(--gl-muted); line-height: 1.45; }
.gl-ico-ok { flex: 0 0 auto; margin-top: 0.15rem; stroke: var(--gl-green); }
.gl-hero__media { position: relative; margin: 0; justify-self: center; width: min(88vw, 440px); }
.gl-hero__media img { width: 100%; border-radius: 24px; background: var(--gl-soft); }
.gl-hero__badge { position: absolute; left: -6px; bottom: 22px; display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.9rem 0.6rem 0.6rem; border-radius: 14px; background: var(--gl-bg); box-shadow: var(--gl-shadow); font-size: 0.82rem; line-height: 1.25; color: var(--gl-body); }
.gl-hero__badge strong { color: var(--gl-ink); }
.gl-hero__badge-coin { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--gl-gold-soft); color: var(--gl-gold); font-family: var(--gl-display); font-weight: 800; }
@media (min-width: 768px) {
  .gl-hero { grid-template-columns: 1.15fr 0.85fr; align-items: center; padding-block: 3.5rem 3rem; }
  .gl-hero__actions { grid-auto-flow: column; justify-content: start; }
  .gl-hero__media { justify-self: end; width: min(100%, 440px); }
  .gl-hero__badge { left: -28px; bottom: 36px; font-size: 0.9rem; }
}

.gl-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0 max(16px, 4vw); max-width: 1120px; margin: 0 auto; }
.gl-stat { display: grid; gap: 0.15rem; padding: 1rem 1.05rem; border-radius: var(--gl-radius); background: var(--gl-soft); border: 1px solid var(--gl-line); }
.gl-stat strong { font-family: var(--gl-display); font-size: clamp(1.35rem, 5vw, 1.9rem); font-weight: 800; color: var(--gl-blue); font-variant-numeric: tabular-nums; line-height: 1.1; }
.gl-stat span { color: var(--gl-muted); font-size: 0.84rem; line-height: 1.35; }
@media (min-width: 768px) { .gl-stats { grid-template-columns: repeat(4, 1fr); gap: 14px; } }

.gl-section { padding: 3.25rem max(16px, 4vw); max-width: 1120px; margin-inline: auto; }
.gl-section--soft { max-width: none; background: var(--gl-soft); }
.gl-section--soft > * { max-width: 1120px; margin-inline: auto; }
@media (min-width: 768px) { .gl-section { padding-block: 5rem; } }

.gl-steps { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 1.25rem; }
.gl-step { display: grid; grid-template-columns: 44px 1fr; gap: 0.9rem; }
.gl-step__n { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--gl-honey); color: var(--gl-ink); font-family: var(--gl-display); font-weight: 800; }
.gl-step h3 { margin: 0.45rem 0 0.3rem; font-family: var(--gl-display); font-size: 1.1rem; font-weight: 700; }
.gl-step p { margin: 0; color: var(--gl-body); }
@media (min-width: 768px) { .gl-steps { grid-template-columns: repeat(3, 1fr); gap: 2rem; } .gl-step { grid-template-columns: 1fr; } }

/* Mission cards: horizontal snap on mobile, grid on desktop. The negative margin
   is balanced by the same padding, so the track never widens the page. */
.gl-cards { list-style: none; margin: 0 calc(-1 * max(16px, 4vw)); padding: 0 max(16px, 4vw) 0.75rem; display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: max(16px, 4vw); -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.gl-cards::-webkit-scrollbar { display: none; }
.gl-card { flex: 0 0 min(78vw, 300px); scroll-snap-align: start; display: grid; gap: 0.7rem; align-content: start; padding: 1.15rem; border-radius: var(--gl-radius); background: var(--gl-bg); border: 1px solid var(--gl-line); box-shadow: 0 2px 10px rgba(15,23,42,0.04); }
.gl-card__head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; }
.gl-card__tag { font-family: var(--gl-display); font-weight: 700; font-size: 0.95rem; }
.gl-card__pay { flex: 0 0 auto; padding: 0.25rem 0.6rem; border-radius: 999px; background: var(--gl-green-soft); color: var(--gl-green); font-weight: 800; font-size: 0.85rem; font-variant-numeric: tabular-nums; }
.gl-card p { margin: 0; color: var(--gl-body); font-size: 0.95rem; }
.gl-card__time { display: inline-flex; align-items: center; gap: 0.35rem; color: var(--gl-muted); font-size: 0.82rem; font-weight: 600; }
.gl-card__time svg { stroke: var(--gl-muted); }
@media (min-width: 768px) { .gl-section--soft > .gl-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; overflow: visible; margin: 0 auto; padding: 0; } .gl-card { flex: none; } }

.gl-sim { display: grid; gap: 1.5rem; }
.gl-slider { display: grid; gap: 0.5rem; margin-top: 1.25rem; }
.gl-slider label { display: flex; justify-content: space-between; align-items: baseline; font-weight: 600; font-size: 0.95rem; }
.gl-slider output { color: var(--gl-blue); font-weight: 800; font-variant-numeric: tabular-nums; }
.gl-slider input { width: 100%; height: 44px; accent-color: var(--gl-honey-dark); margin: 0; }
.gl-sim__panel { display: grid; gap: 0.3rem; padding: 1.5rem; border-radius: 22px; background: linear-gradient(160deg, var(--gl-blue-soft), var(--gl-bg) 70%); border: 1px solid var(--gl-line); }
.gl-sim__label { color: var(--gl-muted); font-size: 0.82rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.gl-sim__big { font-family: var(--gl-display); font-size: clamp(2.4rem, 11vw, 3.8rem); font-weight: 800; line-height: 1; color: var(--gl-ink); font-variant-numeric: tabular-nums; }
.gl-sim__sub { color: var(--gl-body); font-weight: 600; }
.gl-sim__note { margin: 0.6rem 0 1rem; font-size: 0.85rem; color: var(--gl-muted); }
@media (min-width: 768px) { .gl-sim { grid-template-columns: 1.1fr 0.9fr; gap: 3rem; align-items: center; } }

.gl-trust { display: grid; gap: 10px; margin: 1.25rem 0 1.5rem; }
.gl-trust__item { padding: 1rem 1.1rem; border-radius: var(--gl-radius); border: 1px solid var(--gl-line); border-left: 4px solid var(--gl-green); }
.gl-trust__item dt { font-family: var(--gl-display); font-weight: 700; font-size: 0.98rem; margin-bottom: 0.35rem; }
.gl-trust__item dd { margin: 0; color: var(--gl-body); font-size: 0.95rem; }
@media (min-width: 768px) { .gl-trust { grid-template-columns: repeat(3, 1fr); gap: 14px; } }

.gl-faq { border-top: 1px solid var(--gl-line); }
.gl-faq__item { border-bottom: 1px solid var(--gl-line); }
.gl-faq__item summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 56px; padding: 0.9rem 0; font-weight: 700; cursor: pointer; list-style: none; }
.gl-faq__item summary::-webkit-details-marker { display: none; }
.gl-faq__item summary::after { content: "+" / ""; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--gl-blue-soft); color: var(--gl-blue); font-weight: 800; transition: transform 0.2s; }
.gl-faq__item[open] summary::after { transform: rotate(45deg); }
.gl-faq__item p { margin: 0 0 1.1rem; color: var(--gl-body); max-width: 62ch; }

.gl-signup { padding: 3.25rem max(16px, 4vw) 3.5rem; }
.gl-signup__card { max-width: 560px; margin-inline: auto; padding: 1.5rem; border-radius: 22px; background: var(--gl-bg); border: 1px solid var(--gl-line); box-shadow: var(--gl-shadow); }
.gl-form { position: relative; display: grid; gap: 0.5rem; }
.gl-form > label { margin-top: 0.5rem; font-size: 0.9rem; font-weight: 700; }
.gl-form input:not([type="checkbox"]), .gl-form select {
  width: 100%; min-height: 50px; padding: 0.8rem 0.95rem; border-radius: 12px;
  border: 1.5px solid var(--gl-line); background: var(--gl-bg); color: var(--gl-ink);
  font: inherit; font-size: 16px; line-height: 1.4;
}
.gl-form input:not([type="checkbox"]) { cursor: text; }
.gl-form select { cursor: pointer; }
.gl-form input:focus-visible, .gl-form select:focus-visible { outline: none; border-color: var(--gl-honey-dark); box-shadow: 0 0 0 3px rgba(242, 169, 0, 0.28); }
/* Honeypot: invisible without off-screen offsets (a -10000px offset scrolls sideways in RTL). */
.gl-form__hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); opacity: 0; pointer-events: none; }
.gl-form__consent { display: flex; gap: 0.65rem; align-items: flex-start; margin-top: 0.6rem; font-size: 0.9rem; color: var(--gl-body); cursor: pointer; }
.gl-form__consent input { width: 20px; height: 20px; margin-top: 0.15rem; flex: 0 0 auto; accent-color: var(--gl-ink); cursor: pointer; }
.gl-form .gl-btn { margin-top: 0.8rem; }
.gl-form__hint { margin: 0.6rem 0 0; font-size: 0.84rem; color: var(--gl-muted); text-align: center; }
.gl-form__status:empty { display: none; }
.gl-form__status { margin-bottom: 0.8rem; }
.gl-form__ok { margin: 0; padding: 1rem 1.1rem; border-radius: 12px; background: var(--gl-green-soft); color: var(--gl-green); font-weight: 600; }
.gl-form__err { margin: 0; padding: 0.85rem 1rem; border-radius: 12px; background: var(--gl-red-soft); color: var(--gl-red); font-weight: 600; font-size: 0.93rem; }
@media (min-width: 768px) { .gl-signup__card { padding: 2.25rem; } }

.gl-footer { padding: 2rem max(16px, 4vw) 6rem; border-top: 1px solid var(--gl-line); color: var(--gl-muted); font-size: 0.84rem; max-width: 1120px; margin-inline: auto; }
.gl-footer p { margin: 0.6rem 0 0; max-width: 70ch; }
.gl-footer__links { display: flex; flex-wrap: wrap; gap: 0.75rem 1.25rem; }
.gl-footer__links a { color: var(--gl-body); font-weight: 600; text-decoration: none; }
.gl-footer__links a:hover { text-decoration: underline; }
@media (min-width: 768px) { .gl-footer { padding-bottom: 2.5rem; } }

.gl-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 38; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.6rem 16px calc(0.6rem + env(safe-area-inset-bottom, 0px)); background: rgba(255,255,255,0.96); backdrop-filter: blur(10px); border-top: 1px solid var(--gl-line); transform: translateY(110%); transition: transform 0.25s ease; }
.gl-bar.is-visible { transform: translateY(0); }
.gl-bar__text { font-size: 0.86rem; color: var(--gl-body); }
.gl-bar .gl-btn { min-height: 44px; padding: 0.55rem 1.1rem; font-size: 0.95rem; white-space: nowrap; }
@media (min-width: 768px) { .gl-bar { display: none; } }

.gl-legal { min-height: 100dvh; padding: 2.5rem max(16px, 4vw) 4rem; max-width: 760px; margin-inline: auto; }
.gl-legal__back { display: inline-block; margin-bottom: 1.5rem; font-weight: 600; text-decoration: none; }
.gl-legal__date { color: var(--gl-muted); font-size: 0.9rem; }
.gl-legal h2 { font-family: var(--gl-display); font-size: 1.1rem; margin: 1.8rem 0 0.5rem; }
.gl-legal p { color: var(--gl-body); max-width: 65ch; }
.gl-legal__contact { margin-top: 2.5rem; }

.gl a:focus-visible, .gl button:focus-visible, .gl summary:focus-visible, .gl-nav a:focus-visible, .gl-nav button:focus-visible, .gl-slider input:focus-visible, .gl-bar a:focus-visible { outline: 3px solid var(--gl-ink); outline-offset: 3px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) {
  .gl *, .gl *::before, .gl *::after, .gl-bar, .gl-burger span, .gl-burger span::before, .gl-burger span::after { transition: none !important; animation: none !important; }
}

/* ===== Onboarding ===== */
.gl-onb { min-height: 100dvh; background: var(--gl-soft); padding: 0 0 3rem; }
.gl-onb__top { display: flex; align-items: center; justify-content: space-between; height: var(--gl-nav-h); padding: 0 max(16px, 4vw); background: var(--gl-bg); border-bottom: 1px solid var(--gl-line); }
.gl-onb__secure { font-size: 0.85rem; font-weight: 700; color: var(--gl-green); }
.gl-onb__card { max-width: 560px; margin: 1rem auto 0; padding: 1.4rem max(16px, 4vw) 1.8rem; background: var(--gl-bg); border: 1px solid var(--gl-line); border-radius: 22px; box-shadow: var(--gl-shadow); }
@media (min-width: 600px) { .gl-onb__card { margin-top: 2rem; padding: 2.25rem; } }
.gl-onb__progress { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin: 0 0 1.2rem; }
.gl-onb__progress span { height: 6px; border-radius: 3px; background: var(--gl-line); }
.gl-onb__progress span.is-done { background: var(--gl-green); }
.gl-onb__progress span.is-current { background: var(--gl-honey); }
.gl-onb__title { margin-bottom: 0.4rem; }
.gl-onb__title:focus-visible, .gl-onb__done h1:focus-visible { outline: none; }
.gl-onb__form { display: grid; gap: 1.25rem; margin-top: 1rem; }
.gl-field { display: grid; gap: 0.45rem; margin: 0; padding: 0; border: 0; min-width: 0; }
.gl-field > label, .gl-field > legend { font-size: 0.95rem; font-weight: 700; padding: 0; }
.gl-field__hint { font-weight: 500; color: var(--gl-muted); }
.gl-field input:not([type="checkbox"]), .gl-field select {
  width: 100%; min-height: 50px; padding: 0.8rem 0.95rem; border-radius: 12px;
  border: 1.5px solid var(--gl-line); background: var(--gl-bg); color: var(--gl-ink);
  font: inherit; font-size: 16px; line-height: 1.4;
}
.gl-field input:not([type="checkbox"]) { cursor: text; }
.gl-field select { cursor: pointer; }
.gl-field input:focus-visible, .gl-field select:focus-visible { outline: none; border-color: var(--gl-honey-dark); box-shadow: 0 0 0 3px rgba(242, 169, 0, 0.28); }
.gl-field[data-error] input, .gl-field[data-error] select { border-color: var(--gl-red); }
.gl-field__err { margin: 0; font-size: 0.88rem; font-weight: 600; color: var(--gl-red); }
.gl-choice__grid { display: flex; flex-wrap: wrap; gap: 8px; }
.gl-chip {
  appearance: none; -webkit-appearance: none;
  min-height: 44px; padding: 0.55rem 0.95rem; border-radius: 999px;
  border: 1.5px solid var(--gl-line); background: var(--gl-bg); color: var(--gl-ink);
  font: inherit; font-size: 0.95rem; font-weight: 600; cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.gl-chip:hover { border-color: var(--gl-blue); }
.gl-chip.is-on { background: var(--gl-ink); border-color: var(--gl-ink); color: #fff; }
.gl-chip:focus-visible { outline: 3px solid var(--gl-ink); outline-offset: 2px; }
.gl-field[data-error] .gl-chip { border-color: var(--gl-red-soft); }
.gl-onb__actions { display: grid; gap: 0.6rem; margin-top: 0.5rem; }
@media (min-width: 480px) { .gl-onb__actions { grid-auto-flow: column; grid-auto-columns: 1fr; } }
.gl-onb__done { text-align: center; }
.gl-onb__done .gl-h2 { margin-inline: auto; }
.gl-onb__done .gl-lead { margin-inline: auto; }
.gl-onb__check { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-bottom: 1rem; border-radius: 50%; background: var(--gl-green-soft); color: var(--gl-green); font-size: 2rem; font-weight: 800; }
.gl-signup__list { list-style: none; margin: 0 0 1.4rem; padding: 0; display: grid; gap: 0.5rem; color: var(--gl-body); font-size: 0.95rem; }
.gl-signup__list li { display: flex; gap: 0.5rem; align-items: flex-start; }
.gl-signup__list li::before { content: "✓" / ""; color: var(--gl-green); font-weight: 800; flex: 0 0 auto; }

/* ===== Referral ===== */
.gl-onb .gl-onb__card + .gl-onb__card { margin-top: 12px; }
.gl-onb__ref { margin: 0 0 0.8rem; padding: 0.7rem 0.9rem; border-radius: 12px; background: var(--gl-green-soft); color: var(--gl-green); font-size: 0.92rem; }
.gl-ref__hero { text-align: center; }
.gl-ref__hero .gl-h2, .gl-ref__hero .gl-lead { margin-inline: auto; }
.gl-ref__credit { display: grid; gap: 0.1rem; margin-top: 1rem; padding: 1rem; border-radius: 16px; background: linear-gradient(160deg, var(--gl-gold-soft), var(--gl-bg) 80%); border: 1px solid var(--gl-line); }
.gl-ref__credit span { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--gl-muted); }
.gl-ref__credit strong { font-family: var(--gl-display); font-size: 2.6rem; line-height: 1; color: var(--gl-ink); font-variant-numeric: tabular-nums; }
.gl-ref__credit small { color: var(--gl-body); }
.gl-ref__h3 { margin: 0 0 0.8rem; font-family: var(--gl-display); font-size: 1.15rem; font-weight: 700; }
.gl-ref__linkrow { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.gl-ref__linkrow input {
  min-width: 0; width: 100%; min-height: 48px; padding: 0.7rem 0.9rem; border-radius: 12px;
  border: 1.5px solid var(--gl-line); background: var(--gl-soft); color: var(--gl-ink);
  font: inherit; font-size: 0.9rem; cursor: text;
}
.gl-ref__linkrow .gl-btn { min-height: 48px; }
.gl-ref__share { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 0.8rem; }
.gl-ref__share .gl-btn { min-height: 46px; padding-inline: 0.75rem; font-size: 0.95rem; }
@media (min-width: 480px) { .gl-ref__share { grid-template-columns: repeat(4, 1fr); } }
.gl-ref__list { list-style: none; margin: 0; padding: 0; display: grid; }
.gl-ref__list li { display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 0.8rem; padding: 0.75rem 0; border-top: 1px solid var(--gl-line); }
.gl-ref__avatar { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--gl-blue-soft); color: var(--gl-blue); font-family: var(--gl-display); font-weight: 800; }
.gl-ref__name { display: grid; font-weight: 700; }
.gl-ref__name small { font-weight: 500; color: var(--gl-muted); }
.gl-ref__amount { font-weight: 800; color: var(--gl-green); font-variant-numeric: tabular-nums; }
.gl-ref__home { margin-top: 1.2rem; }
.gl-ref__note { margin: 1rem 0 0; padding: 0.8rem 0.95rem; border-radius: 12px; background: var(--gl-soft); border: 1px solid var(--gl-line); color: var(--gl-body); font-size: 0.9rem; line-height: 1.5; }
.gl-ref__logout { display: block; margin: 0.9rem auto 0; padding: 0.5rem; border: 0; background: none; color: var(--gl-muted); font: inherit; font-size: 0.85rem; text-decoration: underline; cursor: pointer; }

/* Language picker (top of every page): globe + code over a transparent native select. */
.gl-lang { position: relative; display: inline-flex; align-items: center; gap: 0.3rem; min-height: 40px; padding: 0 0.6rem; border: 1px solid var(--gl-line); border-radius: 12px; background: var(--gl-bg); color: var(--gl-ink); font-size: 0.85rem; font-weight: 700; letter-spacing: 0.02em; cursor: pointer; flex: 0 0 auto; }
.gl-lang:hover { border-color: var(--gl-muted); }
.gl-lang:focus-within { outline: 2px solid var(--gl-ink); outline-offset: 2px; }
.gl-lang__ico, .gl-lang__chev { stroke: currentColor; flex: 0 0 auto; }
.gl-lang__chev { opacity: 0.6; }
.gl-lang select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 16px; border: 0; appearance: none; }
.gl-onb__top-right { display: inline-flex; align-items: center; gap: 0.6rem; }
.gl-legal__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.gl-legal__top .gl-legal__back { margin-bottom: 0; }
.gl-legal__note { padding: 0.75rem 1rem; border-radius: 12px; background: var(--gl-soft); color: var(--gl-body); font-size: 0.9rem; }
@media (max-width: 380px) { .gl-onb__secure { display: none; } }

/* Right-to-left (Arabic): mirror the few physical left/right rules. */
[dir="rtl"] .gl-trust__item { border-left: 1px solid var(--gl-line); border-right: 4px solid var(--gl-green); }
[dir="rtl"] .gl-hero__badge { left: auto; right: -6px; padding: 0.6rem 0.6rem 0.6rem 0.9rem; }
@media (min-width: 768px) { [dir="rtl"] .gl-hero__badge { left: auto; right: -28px; } }
[dir="rtl"] .gl-skip { left: auto; right: 16px; }
[dir="rtl"] .gl-hero__actions { justify-content: start; }
[dir="rtl"] input[type="email"], [dir="rtl"] #ref-link, [dir="rtl"] input[inputmode="numeric"] { direction: ltr; text-align: right; }

/* 404 / error screens in the site's own style (readable contrast, logo, language). */
.gl-oops { min-height: 100dvh; display: grid; place-items: center; padding: 2rem 16px; background: var(--gl-soft); }
.gl-oops__card { width: min(100%, 440px); padding: 2rem 1.5rem; border-radius: 20px; background: var(--gl-bg); border: 1px solid var(--gl-line); box-shadow: var(--gl-shadow); text-align: center; }
.gl-oops__code { display: block; margin: 1.25rem 0 0.25rem; font-family: var(--gl-display); font-size: 2.6rem; font-weight: 800; color: var(--gl-blue); line-height: 1; }
.gl-oops__card p { color: var(--gl-body); margin: 0.5rem 0 1.5rem; }
.gl-oops__actions { display: grid; gap: 0.6rem; }
.gl-oops .gl-logo { justify-content: center; }

/* Sticky mobile bar: keep it on one or two lines in every language (long CTAs in ru/pt/tr). */
@media (max-width: 420px) {
  .gl-bar__free { display: none; }
  .gl-bar .gl-btn { padding-inline: 1rem; font-size: 0.92rem; white-space: nowrap; }
}

/* Country / currency picker (sits next to the language picker). */
.gl-region__flag { font-size: 1.05rem; line-height: 1; }
.gl-nav__right, .gl-onb__top-right { gap: 0.4rem; }
@media (max-width: 400px) { .gl-lang { padding: 0 0.45rem; gap: 0.2rem; } .gl-lang__chev { display: none; } }
@media (max-width: 480px) { .gl-onb__secure { display: none; } }
