/* Forge X — the front page's sign-in panel (T-203). Drawn by /assets/js/fx-signin.js; the tokens
   (--gold, --ink, --dim, --line-2, --mono …) are the landing page's own :root. No blue: Forge X. */
.fx-si{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:max(1rem,env(safe-area-inset-top)) 1rem max(1rem,env(safe-area-inset-bottom))}
.fx-si,.fx-si *,.fx-si *::before,.fx-si *::after{box-sizing:border-box}
.fx-si[hidden]{display:none}
html.fx-si-open{overflow:hidden}
.fx-si__back{position:absolute;inset:0;background:rgba(0,0,0,.68);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:fx-si-fade .22s ease both}
.fx-si__card{position:relative;width:min(100%,440px);max-height:100%;overflow-y:auto;overscroll-behavior:contain;padding:2.2rem 2rem 1.5rem;border-radius:20px;border:1px solid var(--line-2);background:linear-gradient(180deg,rgba(24,14,8,.97),rgba(6,4,3,.98) 46%);box-shadow:0 40px 90px -30px #000,0 0 80px -34px rgba(255,140,90,.5);animation:fx-si-rise .28s cubic-bezier(.2,.7,.2,1) both}
.fx-si__card::before{content:"";position:absolute;left:12%;right:12%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,#FF4D9E 22%,#FF8C5A 50%,#FFD36B 78%,transparent);opacity:.85}
@keyframes fx-si-fade{from{opacity:0}}
@keyframes fx-si-rise{from{opacity:0;transform:translateY(14px) scale(.985)}}
.fx-si__x{position:absolute;top:.55rem;right:.55rem;width:44px;height:44px;border:0;border-radius:50%;background:none;color:var(--dim);font-size:22px;line-height:1;cursor:pointer;transition:color .2s}
.fx-si__x:hover{color:var(--gold)}
.fx-si__body{display:flex;flex-direction:column;gap:.85rem}
.fx-si__body>[hidden]{display:none}
.fx-si__k{margin:0;font-family:var(--mono);font-weight:600;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:2rem}
.fx-si__h{margin:0 0 .25rem;font-family:var(--head);font-weight:800;font-size:clamp(1.55rem,5.2vw,1.9rem);letter-spacing:-.02em;line-height:1.08;color:var(--ink)}
.fx-si__p{margin:0;font-size:.95rem;line-height:1.55;color:rgba(238,240,255,.74)}
.fx-si__note{margin:-.25rem 0 0;font-size:.8rem;line-height:1.5;color:var(--dim)}
.fx-si__err{margin:0;font-size:.85rem;line-height:1.45;color:#FF8C5A}
.fx-si__or{display:flex;align-items:center;gap:.9rem;margin:.2rem 0;font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.fx-si__or::before,.fx-si__or::after{content:"";flex:1;height:1px;background:var(--line)}
.fx-si .fx-join,.fx-si .fx-how{height:52px;padding:0 1.4rem;font-size:12.5px;letter-spacing:.14em;cursor:pointer}
.fx-si .fx-how{font-family:var(--mono)}
.fx-si__wide{width:100%}
.fx-si button:disabled{opacity:.55;cursor:default}
.fx-si__form{display:flex;gap:.55rem}
.fx-si__in{flex:1;min-width:0;height:52px;padding:0 1.1rem;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(0,0,0,.5);color:var(--ink);font-family:var(--body);font-size:16px;outline:0;transition:border-color .2s,box-shadow .2s}   /* 16px: iOS does not zoom the page on focus */
.fx-si__in::placeholder{color:rgba(138,143,168,.7)}
.fx-si__in:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(255,211,107,.14)}
.fx-si__in--code{font-family:var(--mono);letter-spacing:.42em;text-align:center}
.fx-si__go{flex:none}
.fx-si__quiet{align-self:center;min-height:44px;padding:0 .8rem;border:0;background:none;color:var(--dim);font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:color .2s}
.fx-si__quiet:hover{color:var(--gold)}
.fx-si__foot{margin:.2rem 0 0;padding-top:.95rem;border-top:1px solid var(--line);font-size:.85rem;color:var(--dim);text-align:center}
.fx-si__foot a{color:var(--gold)}.fx-si__foot a:hover{color:var(--gold-hi)}
.fx-si :focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* wallets */
.fx-si__wallets{display:flex;flex-direction:column;gap:.5rem}
.fx-si__wallet{display:flex;align-items:center;gap:.8rem;min-height:56px;padding:0 1.1rem;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.45);color:var(--ink);font-family:var(--body);font-size:.98rem;text-align:left;cursor:pointer;transition:border-color .2s,background-color .2s}
.fx-si__wallet:hover{border-color:var(--line-2);background:rgba(255,211,107,.06)}
.fx-si__wallet img{border-radius:6px;flex:none}.fx-si__wallet span{flex:1;min-width:0}.fx-si__wallet i{font-style:normal;color:var(--gold);font-size:1.2rem}
.fx-si__wallet.is-busy{opacity:.6;cursor:progress}

/* a member: balance · streak · rank */
.fx-si__stats{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:.55rem;margin:.1rem 0}
.fx-si__stats>div{min-width:0;padding:.85rem .9rem .8rem;border-radius:14px;border:1px solid var(--line);background:rgba(12,8,6,.72)}
.fx-si__stats dt{margin:0 0 .35rem;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.fx-si__stats dd{margin:0;font-family:var(--head);font-weight:800;font-size:1.5rem;line-height:1.05;letter-spacing:-.02em;font-variant-numeric:tabular-nums;background:var(--champ);-webkit-background-clip:text;background-clip:text;color:transparent}
.fx-si__stats dd small{display:block;margin-top:.3rem;font-family:var(--body);font-weight:400;font-size:.72rem;letter-spacing:0;line-height:1.3;color:var(--dim);-webkit-text-fill-color:var(--dim)}

/* the one-time claim: open (a button), done, or locked — and locked always says why */
.fx-si__claim{display:flex;align-items:center;gap:.9rem 1rem;flex-wrap:wrap;padding:1rem 1.1rem;border-radius:14px;border:1px solid var(--line-2);background:rgba(255,211,107,.05)}
.fx-si__claim__t{flex:1 1 12rem;min-width:0}
.fx-si__claim__n{margin:.3rem 0 0;font-size:.95rem;color:rgba(238,240,255,.8)}
.fx-si__claim__n b{font-family:var(--head);font-weight:800;font-size:1.35rem;letter-spacing:-.02em;color:var(--gold)}
.fx-si__claim__why{margin:.4rem 0 0;font-size:.82rem;line-height:1.5;color:rgba(238,240,255,.7)}
.fx-si__claim__why[hidden]{display:none}
.fx-si__claim.is-locked{border-style:dashed;border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.025)}
.fx-si__claim.is-locked .fx-si__k{color:var(--dim)}
.fx-si__claim.is-locked .fx-si__k::before{content:"Locked · "}
.fx-si__claim.is-locked .fx-si__claim__n b{color:rgba(238,240,255,.55)}
.fx-si__claim.is-done{border-color:var(--line)}
.fx-si__claim.is-done .fx-si__k::before{content:"✓ "}

@media (max-width:480px){
  .fx-si{place-items:end center;padding-left:0;padding-right:0;padding-bottom:0}
  .fx-si__card{width:100%;max-height:92svh;padding:1.9rem 1.25rem max(1.25rem,env(safe-area-inset-bottom));border-radius:22px 22px 0 0;border-bottom:0;animation-name:fx-si-sheet}
  .fx-si__form{flex-direction:column}.fx-si__form .fx-si__in{flex:none;width:100%}.fx-si__form .fx-si__go{width:100%}
  .fx-si__claim .fx-si__go{width:100%}
  .fx-si__stats{grid-template-columns:1fr 1fr}.fx-si__stats>div:first-child{grid-column:span 2}
}
@keyframes fx-si-sheet{from{opacity:0;transform:translateY(40px)}}
@media (prefers-reduced-motion:reduce){.fx-si__back,.fx-si__card{animation:none}}
