.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--btn-h);padding:0 28px;font-size:15px;font-weight:500;border-radius:var(--btn-radius);background:var(--brand);color:var(--on-brand);white-space:nowrap;cursor:pointer;transition:background .3s,box-shadow .3s,transform .3s,color .3s;user-select:none}
.btn:hover{background:var(--brand-hover);box-shadow:0 8px 28px rgba(0,0,0,.08);transform:translateY(-2px)}
.btn:active{transform:scale(.97);transition-duration:.15s}
.btn-sm{height:40px;padding:0 18px;font-size:14px}
.btn-lg{height:48px;padding:0 24px;font-size:14.5px;font-weight:600}
.btn-block{width:100%}
.btn.block{width:100%}
/* ---------- GHOST BUTTON — more visible border ---------- */
.btn-ghost {
  background: transparent;
  color: var(--text);
  box-shadow: inset 0 0 0 1.5px rgba(0, 0, 0, 0.9);   /* was var(--line-strong) — darker */
  transition: box-shadow .2s, background .2s, transform .2s;
}

.btn-ghost:hover {
  background: var(--hover);
  box-shadow: inset 0 0 0 1.5px rgba(0, 0, 0, 2);   /* darker on hover */
}
.btn-earn{background:transparent;color:var(--cta-ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}
.btn-earn:hover{background:rgba(255,255,255,.10);box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.btn-submit{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 28px;background:var(--accent);color:var(--accent-fg);border-radius:var(--r);font-size:14.5px;font-weight:600;cursor:pointer;transition:transform .15s,opacity .2s}
.btn-submit:hover{opacity:.92;transform:translateY(-1px)}
.btn-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}
.tag{display:inline-block;background:var(--fill-1);border:1px solid var(--line);color:var(--text-muted);padding:6px 14px;border-radius:100px;font-size:12px;font-weight:500;transition:background .2s}
@media(min-width:768px){.tag{font-size:14px;padding:6px 16px}}
.tag-sm{background:var(--bg-subtle);color:var(--text-2);padding:4px 10px;border-radius:6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;display:inline-block}
.eyebrow{font-size:11px;color:var(--text-3);text-transform:uppercase;letter-spacing:.1em;font-weight:700;margin-bottom:16px;display:inline-block}
.back-link,.back{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--text-2);margin-bottom:32px;transition:color .2s,gap .2s}
.back-link:hover,.back:hover{color:var(--text);gap:10px}
.back-link::before,.back::before{content:"←"}