/* Get the app guide */
html.ig-has [data-ig] { display: none !important; }
html.ig-lock, html.ig-lock body { overflow: hidden; }
.ig { --a: var(--acc, #8f82ec); position: fixed; inset: 0; z-index: 195; display: none; flex-direction: column; color: #fff;
  background: radial-gradient(120% 50% at 50% -10%, color-mix(in srgb, var(--a) 24%, transparent), transparent 70%), var(--bg, #07070b);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, system-ui, sans-serif; }
.ig.on { display: flex; animation: igin .28s cubic-bezier(.2,.9,.3,1); }
@keyframes igin { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.ig svg { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ig button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.ig-head { flex: none; display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; padding: calc(env(safe-area-inset-top) + 8px) 10px 8px; }
.ig-head b { text-align: center; font-size: 16px; font-weight: 650; }
.ig-x { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.06) !important; }
.ig-x svg { width: 20px; height: 20px; }
.ig-body { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.ig-in { max-width: 520px; margin: 0 auto; padding: 4px 16px calc(env(safe-area-inset-bottom) + 28px); box-sizing: border-box; }

.ig-hero { text-align: center; padding: 0 8px 14px; }
.ig-hero img { display: block; margin: 0 auto; width: 52px; height: 52px; border-radius: 14px; box-shadow: 0 10px 30px color-mix(in srgb, var(--a) 40%, transparent); }
.ig-hero h2 { margin: 10px 0 4px; font-size: 20px; letter-spacing: -.02em; }
.ig-hero p { margin: 0 auto; max-width: 340px; font-size: 14px; line-height: 1.45; color: rgba(255,255,255,.6); }

.ig-desk { display: flex; gap: 12px; align-items: flex-start; padding: 13px 14px; margin-bottom: 14px; border-radius: 16px; font-size: 13.5px; line-height: 1.45; color: rgba(255,255,255,.7);
  background: color-mix(in srgb, var(--a) 12%, transparent); border: 1px solid color-mix(in srgb, var(--a) 28%, transparent); }
.ig-desk svg { flex: none; width: 22px; height: 22px; color: #c9c1ff; }
.ig-desk span b:first-child { display: block; color: #fff; margin-bottom: 1px; }
.ig-desk span b { color: #fff; }

.ig-seg { position: relative; display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 14px; background: rgba(255,255,255,.06); margin-bottom: 14px; }
.ig-seg button { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 7px; height: 38px; border-radius: 10px; font-size: 14px; font-weight: 600; color: rgba(255,255,255,.6) !important; transition: color .2s; }
.ig-seg button.on { color: #fff !important; }
.ig-seg button svg { width: 17px; height: 17px; }
.ig-seg i { position: absolute; top: 4px; left: 4px; width: calc(50% - 4px); height: 38px; border-radius: 10px; background: rgba(255,255,255,.12); transition: transform .3s cubic-bezier(.3,.9,.3,1); }

.ig-now { width: 100%; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; gap: 8px; font-weight: 650; background: var(--a) !important; }
.ig-now svg { width: 19px; height: 19px; }
.ig-or { text-align: center; font-size: 12.5px; color: rgba(255,255,255,.45); margin: 10px 0 12px; }

.ig-card { border-radius: 24px; padding: 18px 16px 16px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); }
.ig-phone { display: flex; justify-content: center; padding: 6px 0 4px; touch-action: pan-y; }
.ig-txt { text-align: center; padding: 12px 6px 0; min-height: 96px; }
.ig-n { font-size: 12px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: #c9c1ff; }
.ig-txt h3 { margin: 6px 0 6px; font-size: 19px; letter-spacing: -.01em; }
.ig-txt p { margin: 0; font-size: 14px; line-height: 1.45; color: rgba(255,255,255,.62); }
.ig-dots { display: flex; justify-content: center; gap: 6px; margin: 8px 0 12px; }
.ig-dots button { width: 7px; height: 7px; padding: 0; border-radius: 4px; background: rgba(255,255,255,.18) !important; transition: width .25s, background .25s; }
.ig-dots button.done { background: rgba(255,255,255,.4) !important; }
.ig-dots button.on { width: 22px; background: var(--a) !important; }
.ig-nav { display: grid; grid-template-columns: 1fr 1.6fr; gap: 10px; }
.ig-b { height: 46px; border-radius: 14px; font-weight: 650; display: flex; align-items: center; justify-content: center; gap: 7px; background: var(--a) !important; }
.ig-b.g { background: rgba(255,255,255,.07) !important; }
.ig-b:disabled { opacity: .35; cursor: default; }
.ig-b svg { width: 18px; height: 18px; }

.ig-all { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 2px; }
.ig-all li { display: flex; gap: 12px; padding: 11px 10px; border-radius: 14px; cursor: pointer; font-size: 13px; line-height: 1.4; color: rgba(255,255,255,.5); transition: background .2s; }
.ig-all li.on { background: rgba(255,255,255,.05); color: rgba(255,255,255,.7); }
.ig-all li i { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 12px; font-weight: 700; background: rgba(255,255,255,.08); }
.ig-all li.on i { background: var(--a); color: #fff; }
.ig-all b { display: block; color: #fff; font-size: 14px; margin-bottom: 1px; }

/* phone mockup */
.igm { position: relative; width: 184px; height: 320px; border-radius: 34px; overflow: hidden; background: #111118; box-shadow: 0 0 0 7px #1c1c24, 0 0 0 8px rgba(255,255,255,.12), 0 24px 50px rgba(0,0,0,.5);
  animation: igm .35s cubic-bezier(.2,.9,.3,1); font-size: 10.5px; color: #fff; }
@keyframes igm { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: none; } }
.igm:before { content: ""; position: absolute; top: 9px; left: 50%; width: 58px; height: 17px; margin-left: -29px; border-radius: 10px; background: #000; z-index: 5; }
.igm svg { stroke-width: 2; }
.igm img { display: block; object-fit: cover; }
.igm .hl { position: relative; color: #fff; }
.igm .hl:after { content: ""; position: absolute; inset: -5px; border-radius: 12px; border: 2px solid var(--a); box-shadow: 0 0 0 4px color-mix(in srgb, var(--a) 30%, transparent); animation: igp 1.6s ease-in-out infinite; pointer-events: none; }
@keyframes igp { 50% { transform: scale(1.08); opacity: .55; } }
.igm-site { position: absolute; inset: 40px 14px auto; display: grid; gap: 9px; }
.igm-site i { display: block; height: 58px; border-radius: 12px; background: rgba(255,255,255,.07); }
.igm-site i:first-child { background: linear-gradient(135deg, color-mix(in srgb, var(--a) 55%, #111), rgba(255,255,255,.06)); }
.igm-site i.s { height: 22px; width: 70%; }
.igm-url { display: flex; align-items: center; justify-content: center; gap: 5px; height: 30px; border-radius: 15px; background: rgba(255,255,255,.12); color: rgba(255,255,255,.85); font-weight: 600; }
.igm-url svg { width: 10px; height: 10px; }
.igm-url.a { flex: 1; justify-content: flex-start; padding: 0 10px; border-radius: 15px; }
.igm-btm { position: absolute; left: 0; right: 0; bottom: 0; padding: 9px 12px 18px; background: rgba(30,30,38,.92); backdrop-filter: blur(8px); }
.igm-tools { display: flex; justify-content: space-around; align-items: center; margin-top: 9px; font-size: 18px; color: #6aa5ff; }
.igm-tools span { display: grid; place-items: center; width: 26px; height: 24px; }
.igm-tools svg { width: 18px; height: 18px; }
.igm-top { position: absolute; top: 30px; left: 10px; right: 10px; display: flex; gap: 8px; align-items: center; }
.igm-top > span { display: grid; place-items: center; width: 22px; height: 26px; }
.igm-top svg { width: 16px; height: 16px; }
.igm.and .igm-site { top: 72px; }
.igm-dim { position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.igm-sheet { position: absolute; left: 6px; right: 6px; bottom: 6px; border-radius: 22px; padding: 12px 10px; background: #26262f; animation: igup .4s cubic-bezier(.2,.9,.3,1); }
@keyframes igup { from { transform: translateY(40%); } to { transform: none; } }
.igm-sh-top { display: flex; gap: 8px; align-items: center; padding: 0 4px 10px; border-bottom: 1px solid rgba(255,255,255,.08); }
.igm-sh-top img, .igm-add-c img { width: 30px; height: 30px; border-radius: 8px; }
.igm-sh-top span, .igm-add-c span { display: grid; }
.igm-sh-top small, .igm-add-c small { color: rgba(255,255,255,.5); font-size: 9.5px; }
.igm-list { display: grid; gap: 5px; margin-top: 10px; }
.igm-list span { display: flex; align-items: center; justify-content: space-between; padding: 9px 10px; border-radius: 10px; background: rgba(255,255,255,.06); }
.igm-list svg { width: 14px; height: 14px; }
.igm-add { position: absolute; inset: 0; padding: 36px 12px; background: #1b1b22; }
.igm-add-h { display: flex; justify-content: space-between; align-items: center; color: #6aa5ff; }
.igm-add-h b { color: #fff; font-size: 10.5px; }
.igm-add-h .hl { font-weight: 700; padding: 0 2px; }
.igm-add-c { display: flex; gap: 9px; align-items: center; margin-top: 18px; padding: 10px; border-radius: 12px; background: rgba(255,255,255,.06); }
.igm-add-t { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding: 10px; border-radius: 12px; background: rgba(255,255,255,.06); }
.igm-add-t i { width: 30px; height: 18px; border-radius: 9px; background: #34c759; position: relative; }
.igm-add-t i:after { content: ""; position: absolute; top: 2px; right: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; }
.igm-menu { position: absolute; top: 34px; right: 8px; width: 128px; padding: 6px; border-radius: 12px; background: #2a2a33; box-shadow: 0 10px 30px rgba(0,0,0,.5); display: grid; gap: 2px; animation: igm .3s; }
.igm-menu span { padding: 8px; border-radius: 8px; }
.igm-dlg { position: absolute; left: 14px; right: 14px; top: 110px; padding: 14px; border-radius: 20px; background: #2a2a33; animation: igm .3s; }
.igm-dlg > b { font-size: 12px; }
.igm-dlg .igm-add-c { margin-top: 10px; }
.igm-dlg-a { display: flex; justify-content: flex-end; gap: 16px; margin-top: 14px; color: #8ab4f8; font-weight: 650; }
.igm-dlg-a .hl { padding: 0 3px; }
.igm-home { position: absolute; inset: 0; padding: 44px 18px; display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 52px; gap: 8px 10px; justify-items: center;
  background: linear-gradient(160deg, color-mix(in srgb, var(--a) 60%, #0b0b12), #0b0b12 70%); }
.igm-home i { width: 34px; height: 34px; border-radius: 9px; opacity: .55; }
.igm-app { display: grid; justify-items: center; gap: 3px; }
.igm-app img { width: 34px; height: 34px; border-radius: 9px; }
.igm-app small { font-size: 8px; }
.igm-app.hl:after { inset: -4px -6px; }

/* entry points */
.ig-pill { display: flex; width: fit-content; align-items: center; gap: 7px; margin: 14px auto 0; padding: 9px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.05); color: #fff; font: 600 13.5px/1 -apple-system, BlinkMacSystemFont, Inter, system-ui, sans-serif; cursor: pointer; }
.ig-pill svg { width: 16px; height: 16px; fill: none; stroke: #c9c1ff; stroke-width: 1.9; stroke-linecap: round; }
.ig-link { margin-top: 6px; align-self: flex-start; padding: 8px 12px; border-radius: 10px; border: 0; background: color-mix(in srgb, var(--acc, #8f82ec) 22%, transparent); color: #fff; font: 600 12.5px/1 inherit; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .ig.on, .igm, .igm .hl:after, .igm-sheet, .igm-menu, .igm-dlg { animation: none; } }
/* sign-in: the "How to get the app" pill sits centred under the column on every screen size */
#au .ig-pill{width:fit-content!important;min-width:0!important;max-width:100%!important;margin:14px auto 0!important;align-self:center!important;justify-self:center!important;position:static!important;transform:none!important;left:auto!important;right:auto!important}
/* wide screens: the column is 440px wide inside a wider panel, so centre the pill on the column, not the panel */
@media (min-width: 1100px){#au .b5-panel>.ig-pill{margin:14px 0 0 calc(min(100%, 440px) / 2)!important;transform:translateX(-50%)!important;align-self:flex-start!important}}