/* Team seats (13.12, team.js): the bar that says whose account a teammate works in, Settings, Team, and the switcher in
   the account menu. Only tokens of app.css, so Light and Dark both follow. */
.main > .team-bar { padding: 14px 28px 0; }
.main > .team-bar .banner { margin: 0; max-width: 1520px; margin-inline: auto; }
.team-bar .banner .btn { flex: none; }
@media (max-width: 1080px) { .main > .team-bar { padding: 12px 20px 0; } }
@media (max-width: 767px) {
  .main > .team-bar { padding: 10px 12px 0; }
  .team-bar .banner { flex-wrap: wrap; }
}

.team-form { display: flex; gap: 10px; flex-wrap: wrap; margin: 4px 0 6px; }
.team-form .input { flex: 1 1 240px; min-width: 0; }
.team-list { margin-top: 18px; }
.team-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 0; border-top: 1px solid var(--border); }
.team-row:first-child { border-top: 0; }
.team-row .grow { min-width: 170px; flex: 1 1 170px; line-height: 1.4; }
.team-row .team-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.team-av { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; flex: none; font-weight: 700;
  font-size: 13px; color: var(--on-brand); background: var(--brand-ink); }
.team-av.wait { background: var(--surface-3); color: var(--text-3); }
.team-act { padding: 9px 0; border-top: 1px solid var(--border); line-height: 1.5; overflow-wrap: anywhere; }
.team-act:first-child { border-top: 0; }
.team-act .when { white-space: nowrap; }
.team-menu-h { padding: 8px 12px 2px; }
.team-menu button[disabled] { opacity: 1; cursor: default; }
.join-card .lead b { overflow-wrap: anywhere; }
.join-card form { margin-top: 6px; }
.join-card .input-icon + .input-icon { margin-top: 10px; }

/* a teammate's menu leaves out what belongs to the owner (the pages say so too, if opened another way) */
html[data-team="editor"] .nav [data-nav="earn"], html[data-team="editor"] .nav [data-nav="admin"] { display: none; }