/* Bot-Man Members: builds on ../play.css (tokens, buttons, kicker, medals). */
body.members{height:auto;min-height:100dvh;display:block;padding:max(14px,env(safe-area-inset-top)) clamp(14px,4vw,40px) max(24px,env(safe-area-inset-bottom))}
.members .top{margin:0 auto 18px}
.m-main{max-width:980px;margin:0 auto;display:grid;gap:clamp(22px,4vw,40px)}
.hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.7em;padding:clamp(22px,5vw,46px) 16px;border:1.5px solid var(--ink);border-radius:24px;
  background:radial-gradient(120% 90% at 50% 0%,color-mix(in srgb,var(--teal) 14%,var(--paper)),var(--paper) 60%)}
.hero h2{font-family:var(--f-display);font-weight:600;font-size:clamp(2rem,6.4vw,3.6rem);line-height:.98;letter-spacing:-.03em;max-width:16ch}
.lede{font-size:clamp(1rem,2.2vw,1.2rem);line-height:1.4;max-width:46ch;color:#2b2925}
.hero .medal.big{width:76px;height:76px}
.medal.lock{--c:var(--line);background:#cfcac0}
.medal.lock::before,.medal.lock::after{background:var(--paper)}
#unlocked .medal.big{animation:pop .7s cubic-bezier(.3,1.6,.5,1) both,glow 2.4s ease-in-out .7s infinite alternate}
@keyframes glow{to{box-shadow:0 0 0 4px var(--paper),0 0 0 8px var(--c),0 0 44px 16px color-mix(in srgb,var(--c) 55%,transparent)}}
.sec{font-family:var(--f-mono);font-weight:500;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:.8em}
.cards{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.card{position:relative;border:1.5px solid var(--line);border-radius:20px;padding:20px 18px 16px;display:flex;flex-direction:column;gap:.55em;background:var(--paper);opacity:.72}
.card.got{opacity:1;border-color:var(--ink)}
.card.mine{box-shadow:0 14px 40px color-mix(in srgb,var(--teal) 35%,transparent)}
.card .medal{margin:4px 0 4px 4px}
.t-name{font-family:var(--f-display);font-weight:600;font-size:1.3rem;letter-spacing:-.01em}
.t-how{font-size:.88rem;line-height:1.4;color:var(--mute)}
.perks{list-style:none;display:grid;gap:.35em;font-size:.95rem;line-height:1.35;flex:1;align-content:start}
.perks li{display:flex;gap:.55em}
.perks li::before{content:"";flex:none;width:.5em;height:.5em;border-radius:50%;background:var(--line);margin-top:.45em}
.card.got .perks li::before{background:var(--teal)}
.t-state{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);border-top:1.5px solid var(--line);padding-top:.6em}
.card.got .t-state{color:var(--teal-ink)}
.demo-note{font-family:var(--f-mono);font-size:.74rem;color:var(--mute);margin-top:.9em}
.join{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(18px,4vw,40px);align-items:start;border:1.5px solid var(--ink);border-radius:24px;padding:clamp(18px,4vw,34px)}
.join h3{font-family:var(--f-display);font-weight:600;font-size:clamp(1.6rem,4vw,2.4rem);line-height:1;letter-spacing:-.02em;margin:.4em 0}
.join-copy p{line-height:1.45}
.signup{display:flex;flex-direction:column;gap:14px;position:relative}
.signup .field{display:flex;flex-direction:column;gap:.4em;min-width:0;border:0}
.signup label,.signup legend{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#4a4740}
.signup legend{margin-bottom:.4em;padding:0}
.signup .opt{color:var(--mute);text-transform:none;letter-spacing:.02em}
.signup input[type=text],.signup input[type=email]{font-family:var(--f-body);font-size:16px;color:var(--ink);background:#fff;border:1.5px solid var(--ink);border-radius:12px;padding:.7em .9em;width:100%}
.signup input::placeholder{color:#77726a}
.signup input[type=text]:focus-visible,.signup input[type=email]:focus-visible{outline:3px solid var(--ink);outline-offset:2px;border-color:var(--teal)}
.signup .seg{display:flex;gap:.5em}
.signup .pill{flex:1;position:relative;text-transform:none;letter-spacing:0;cursor:pointer}
.signup .pill input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.signup .pill span{display:flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--f-body);font-weight:500;font-size:15px;color:var(--ink);border:1.5px solid var(--line);border-radius:999px;padding:.6em .8em;background:#fff}
.signup .pill span::before{content:"";width:.6em;height:.6em;border-radius:50%;border:1.5px solid var(--mute)}
.signup .pill input:checked + span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.signup .pill input:checked + span::before{background:var(--teal);border-color:var(--teal)}
.signup .pill input:focus-visible + span{outline:3px solid var(--ink);outline-offset:2px}
.signup .hp{position:absolute!important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.su-btn{font-family:var(--f-display);font-weight:600;font-size:1.15rem;color:var(--paper);background:var(--ink);border:0;border-radius:999px;padding:.8em 1.4em;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;transition:transform .2s,box-shadow .2s}
.su-btn::before{content:"";width:.6em;height:.6em;border-radius:50%;background:var(--teal);box-shadow:0 0 10px var(--teal)}
.su-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px color-mix(in srgb,var(--teal) 40%,transparent)}
.su-btn:disabled{cursor:progress;opacity:.7;transform:none}
.su-status{font-size:.92rem;color:#4a4740}
.su-status:empty,.su-err:empty{display:none}
.su-err{font-size:.85rem;color:#b2410c}
.signup input[aria-invalid="true"]{border-color:#b2410c}
.su-status.is-error{color:var(--ink);background:color-mix(in srgb,var(--orange) 14%,var(--paper));border-left:3px solid var(--orange);padding:.55em .85em;border-radius:8px}
.signup.is-done .field,.signup.is-done .su-btn{display:none}
.signup.is-done .su-status{font-family:var(--f-display);font-weight:600;font-size:1.8rem;line-height:1;letter-spacing:-.02em;color:var(--ink);display:flex;align-items:center;gap:.4em;padding:1em 0}
.signup.is-done .su-status::before{content:"";flex:none;width:.5em;height:.5em;border-radius:50%;background:var(--teal);box-shadow:0 0 18px var(--teal)}
.gate-note{font-family:var(--f-mono);font-size:.76rem;color:var(--mute);text-align:center}
.gate-note a{color:var(--ink)}
@media (max-width:760px){
  .cards,.join{grid-template-columns:1fr}
  .members .top .links{order:0;margin-left:0;width:100%}
}
.badge-row{display:flex;align-items:center;gap:22px;flex-wrap:wrap;justify-content:center}
.iq-badge{display:flex;flex-direction:column;align-items:flex-start;font-family:var(--f-mono);font-size:.78rem;border:1.5px dashed var(--purple);border-radius:14px;padding:.5em .8em;text-align:left;max-width:22ch}
.iq-badge b{font-family:var(--f-display);font-weight:600;font-size:1.6rem;line-height:1}
.iq-badge span{color:var(--mute);font-size:.7rem}