/* Join screen (no active plan) and team seats; uses the tokens from chat.css, light and dark */
.gate{position:fixed;inset:0;z-index:80;overflow:auto;display:grid;place-items:center;padding:28px 16px;
  background:radial-gradient(60vw 50vh at 85% -10%,rgba(35,64,200,.10),transparent 70%),var(--side)}
.gate[hidden]{display:none}
.gCard{position:relative;width:100%;max-width:480px;padding:30px 26px 24px;border-radius:18px;background:var(--card);
  border:1px solid var(--line2);box-shadow:0 22px 60px rgba(11,27,63,.10);text-align:center}
.gX{position:absolute;top:10px;right:12px;width:34px;height:34px;border-radius:9px;font-size:22px;line-height:1;color:var(--muted)}
.gX:hover{background:var(--surface);color:var(--text)}
.gLogo{display:block;margin:0 auto 16px;border-radius:14px;box-shadow:0 8px 22px rgba(35,64,200,.22)}
.gCard h1{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.25}
.gSub{margin-top:8px;color:var(--text2);font-size:14.5px;line-height:1.55}
.gPrice{margin:20px 0 4px;padding:14px;border-radius:12px;background:var(--sunk);border:1px solid var(--line)}
.gPrice b{display:block;font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--text)}
.gPrice span{display:block;margin-top:2px;font-size:12px;color:var(--muted)}
.gList{list-style:none;margin:16px 0 4px;padding:0;text-align:left;display:grid;gap:8px}
.gList li{position:relative;padding-left:26px;font-size:14px;color:var(--text2);line-height:1.45}
.gList li::before{content:"";position:absolute;left:4px;top:5px;width:12px;height:7px;border-left:2px solid var(--accent);
  border-bottom:2px solid var(--accent);transform:rotate(-45deg)}
.gActs{display:grid;gap:8px;margin-top:20px}
.gGo,.gAlt{height:46px;border-radius:11px;font-weight:700;font-size:15px;transition:background .15s,border-color .15s}
.gGo{color:var(--on-accent);background:var(--accent);box-shadow:0 6px 16px rgba(35,64,200,.22)}
.gGo:hover{background:var(--accent2)}
.gAlt{color:var(--text);background:var(--card);border:1px solid var(--line2)}
.gAlt:hover{border-color:var(--gline)}
.gGo:disabled,.gAlt:disabled{opacity:.6;cursor:default}
.gDone{padding:12px;border-radius:11px;background:var(--accent-soft);color:var(--text2);font-size:13.5px;line-height:1.5}
.gReq{margin-top:12px;text-align:left;display:grid;gap:10px}
.gReq[hidden]{display:none}
.gReq label{font-size:13px;font-weight:600;color:var(--text2)}
.gReq label i{font-weight:400;color:var(--muted)}
.gReq textarea,.gCode input{display:block;width:100%;margin-top:6px;padding:11px 13px;border-radius:10px;border:1px solid var(--line2);
  background:var(--sunk);color:var(--text);outline:0;font:inherit;font-size:14px;resize:vertical}
.gReq textarea:focus,.gCode input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(35,64,200,.12)}
.gCode{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:14px}
.gCode input{margin:0;height:44px;text-transform:uppercase;letter-spacing:.04em}
.gCode input::placeholder{text-transform:none;letter-spacing:0}
.gCode .gAlt{height:44px;padding:0 16px;font-size:14px}
.gErr{margin-top:10px;font-size:13px;color:var(--bad)}
.gErr[hidden]{display:none}
.gFoot{margin-top:18px;font-size:12.5px;color:var(--muted);line-height:1.7}
.gFoot a{color:var(--accent);font-weight:600}
html.gated .app{visibility:hidden}
/* login link form, notes, payment spinner */
.gMail{display:grid;gap:10px;margin-top:4px;text-align:left}
.gMail[hidden],.gCode[hidden],.gMail input[hidden],.gActs button[hidden]{display:none}
.gMail input{display:block;width:100%;height:46px;padding:0 14px;border-radius:11px;border:1px solid var(--line2);
  background:var(--sunk);color:var(--text);outline:0;font:inherit;font-size:15px}
.gMail input:focus{border-color:var(--accent);background:var(--card);box-shadow:0 0 0 3px rgba(35,64,200,.12)}
.gMail .gInv{text-transform:uppercase;letter-spacing:.04em}
.gMail .gInv::placeholder{text-transform:none;letter-spacing:0}
.gNote{font-size:13.5px;color:var(--text2);line-height:1.5;text-align:left}
.gActs .gNote{text-align:center;margin-top:4px}
.gNote a,.gDone a{color:var(--accent);font-weight:600}
.gCard>.gErr{margin:12px 0 0}
.gCard>.gDone{margin-top:18px}
.gMail+.gMsg{margin-top:10px}
.gSub+.gMail,.gCard>.gErr+.gMail{margin-top:20px}
.gPrice+.gMail{margin-top:14px}
.gSpin{width:34px;height:34px;margin:22px auto 4px;border-radius:50%;border:3px solid var(--line2);border-top-color:var(--accent);
  animation:gSpin .9s linear infinite}
@keyframes gSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.gSpin{animation-duration:2.4s}}

.teamBox .tmList{display:grid;gap:6px;margin-bottom:14px}
.tmRow{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--sunk)}
.tmRow>div{flex:1;min-width:0}
.tmRow b{display:block;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tmRow i{display:block;font-style:normal;font-size:12px;color:var(--muted)}
.tmAv{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;
  background:var(--accent-soft);color:var(--accent)}
.tmLink{margin-bottom:14px;padding:12px;border-radius:10px;background:var(--accent-soft)}
.tmLink p{font-size:13px;color:var(--text2);margin-bottom:8px}
.tmLink div{display:flex;gap:8px}
.tmLink input{margin:0;flex:1;min-width:0;font-size:12.5px}
.tmForm{display:flex;align-items:flex-end;gap:10px}
.tmForm label{flex:1;margin-bottom:0}
.tmForm .go{height:44px;padding:0 18px;border-radius:10px;font-weight:700;color:var(--on-accent);background:var(--accent)}
.tmForm .go:hover{background:var(--accent2)}
.teamBox .mErr{margin:12px 0 0}
.teamBox .mFoot .danger{margin-right:0}
[data-theme="dark"] .gCard{box-shadow:0 24px 70px rgba(0,0,0,.5)}
[data-theme="dark"] .gate{background:var(--bg)}
[data-theme="dark"] .gLogo{box-shadow:0 8px 22px rgba(0,0,0,.5)}
[data-theme="dark"] .gGo{box-shadow:0 6px 16px rgba(77,93,255,.25)}
[data-theme="dark"] .tmAv{color:#9AABFF}
@media (max-width:480px){.gCard{padding:24px 18px 20px}.gCard h1{font-size:21px}.tmForm{flex-direction:column;align-items:stretch}}
[data-theme="dark"] .gFoot a,[data-theme="dark"] .gNote a,[data-theme="dark"] .gDone a{color:#9AABFF}