/* Онбординг: один крок — один екран, одна головна кнопка. Кольори — змінні з index.html. */
.onb{display:flex;flex-direction:column;gap:14px;padding-top:18px;min-height:100%}
.onb-steps{list-style:none;margin:0 0 6px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.onb-steps li{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--mut);font-weight:600;min-width:0}
.onb-steps li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.onb-steps b{flex:none;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--s2);color:var(--mut);font-size:12px}
.onb-steps li.on{color:var(--tx)}
.onb-steps li.on b{background:var(--gold);color:var(--gold-ink)}
.onb-steps li.done b{background:var(--lime);color:var(--lime-ink)}
.onb-h{font-family:'Space Grotesk',sans-serif;font-size:26px;line-height:1.15;margin:4px 0 0}
.onb-p{color:var(--soft);font-size:15px;line-height:1.5;margin:0}
.onb-note{color:var(--mut);font-size:13px;line-height:1.5;margin:0}
.onb-wallets{display:flex;flex-direction:column;gap:10px}
.onb-wallet{display:flex;align-items:center;gap:14px;min-height:64px;padding:10px 14px;border-radius:18px;border:1px solid var(--line);background:var(--s1);color:var(--tx);font-weight:700;font-size:17px;text-align:left;animation:in .35s both}
.onb-wallet:first-child{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}
.onb-wallet img{width:42px;height:42px;border-radius:12px;flex:none;background:var(--s2)}
.onb-wallet span{flex:1}
.onb-wallet::after{content:"›";color:var(--mut);font-size:26px;line-height:1}
.onb-wait{color:var(--mut);font-size:14px;padding:14px 0}
.onb-help{background:var(--s1);border:1px solid var(--line);border-radius:16px;padding:12px 14px}
.onb-help summary{cursor:pointer;font-weight:700;min-height:28px;display:flex;align-items:center}
.onb-help[open]{display:flex;flex-direction:column;gap:10px}
.onb-later{background:none;border:0;color:var(--mut);font-size:15px;min-height:44px;margin-top:auto}
.onb-link{background:none;border:0;color:var(--gold);font-weight:600;min-height:44px;padding:0 4px;margin-left:auto}
.onb-who{display:flex;align-items:center;gap:8px;background:var(--s1);border:1px solid var(--line);border-radius:14px;padding:4px 6px 4px 12px;font-size:14px}
.onb-ok{width:22px;height:22px;border-radius:50%;background:var(--lime);color:var(--lime-ink);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex:none}
.onb-chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:8px}
.onb-chips button{min-height:52px;border-radius:14px;border:1px solid var(--line);background:var(--s1);color:var(--tx);font-weight:700;font-size:15px}
.onb-chips button[aria-pressed=true]{background:var(--gold);color:var(--gold-ink);border-color:var(--gold)}
.onb-other{font-size:16px}
.onb-status{border-radius:14px;padding:12px 14px;background:var(--s1);border:1px dashed var(--cyan);color:#CDEFF7;font-size:14px}
.onb-status.wait::before{content:"";display:inline-block;width:12px;height:12px;margin-right:8px;border-radius:50%;border:2px solid var(--cyan);border-right-color:transparent;animation:spin 1s linear infinite;vertical-align:-1px}
.onb-done{text-align:center;padding:30px 0 10px;display:flex;flex-direction:column;gap:6px}
.onb-plus{font-family:'Space Grotesk',sans-serif;font-size:40px;font-weight:700;color:var(--lime)}
.onb-gift{font-size:64px;text-align:center;margin-top:24px;animation:bob 2.4s infinite}
.onb-offer{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;color:var(--gold);margin:0}
.onb-todo{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.onb-todo li{display:flex;align-items:center;gap:10px;background:var(--s1);border:1px solid var(--line);border-radius:14px;padding:12px 14px;font-weight:600}
.onb-todo b{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);flex:none;display:flex;align-items:center;justify-content:center;font-size:12px}
.onb-todo li.done b{background:var(--lime);border-color:var(--lime);color:var(--lime-ink)}
.onb-nudge{border-color:var(--gold)}
.onb-nt{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:18px}
