/*
 * Teams under Personnel (teams-live.js; the Founder, 10 October 2026, ~23:00 Israel, on his iPhone): each team a card
 * of its own, not a Workspace's: a team icon, "N humans · M agents" on top, its name, its goal; a press shows who is on
 * it, faces and names, the Chief crowned. The create and edit form is one form: name, goal, lead, and the humans and
 * agents as boxes to check. Every control at least 44px; nothing scrolls sideways at 320px.
 */
.teams-page .page-heading .actions .btn{min-height:44px}
.teams-page .page-heading .btn .icon,.team-card .btn .icon{width:18px;height:18px}
.team-card{padding:0;overflow:hidden}
.team-card-head{display:flex;align-items:flex-start;gap:14px;width:100%;min-height:72px;padding:16px 18px;text-align:start;cursor:pointer;color:inherit;font:inherit;border-radius:12px}
.team-card-head:focus-visible{outline:3px solid #b987ef;outline-offset:-3px}
.team-icon{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:12px;background:var(--soft,#f2ecfa);color:var(--purple,#6d28b5)}
.team-icon .icon{width:24px;height:24px}
.team-card-copy{display:grid;gap:3px;flex:1;min-width:0}
.team-counts{font-size:.78rem;font-weight:600;color:var(--muted,#686577);letter-spacing:.01em}
.team-name{font-size:1.05rem;line-height:1.3;overflow-wrap:anywhere}
.team-goal{font-size:.9rem;line-height:1.45;color:var(--muted,#686577);white-space:pre-line;overflow-wrap:anywhere}
.team-card-chevron{flex:none;align-self:center;color:var(--muted,#686577);transition:transform .15s ease-out}
.team-card-chevron .icon{width:20px;height:20px}
.team-card.open .team-card-chevron{transform:rotate(180deg)}
.team-who{display:grid;gap:14px;padding:0 18px 18px;min-width:0}
.team-who[hidden]{display:none}
.team-people{list-style:none;margin:0;padding:0;display:grid;gap:10px;min-width:0}
.team-person{display:flex;align-items:center;gap:12px;min-height:44px;min-width:0}
.team-person-name{min-width:0;overflow-wrap:anywhere}
.team-person .team-lead-mark{margin-inline-start:0;background:var(--soft,#f2ecfa);color:var(--purple,#6d28b5)}
.team-led{margin:0}
.team-who>.actions{display:flex;flex-wrap:wrap;gap:10px}
.team-who>.actions .btn{min-height:44px}
.team-form-heading{margin:4px 0 0;font-size:1rem}
/* A face: 34px, the Chief's crown on the corner as in a chat's header (agent-row.css). */
.team-face{position:relative;display:inline-flex;flex:none;width:34px;height:34px}
.team-face>.human-photo.team-human-face{width:34px;height:34px;min-width:34px;font-size:.75rem}
.team-face>.portrait-box.tiny.team-agent-face{width:34px;height:34px;min-width:34px;border-radius:9px}
.team-face>.primary-star.primary-solid{position:absolute;top:-5px;inset-inline-end:-5px;inset-inline-start:auto;display:grid;place-items:center;width:17px;height:17px;padding:2px;box-sizing:border-box;border-radius:50%;background:var(--surface,#fff);color:var(--chief-frame,var(--chief-ink,#6d28b5));box-shadow:0 0 0 1.5px var(--surface,#fff),0 1px 2px #24212d33;z-index:2}
.team-face>.primary-star .primary-crown{width:100%;height:100%}
/* The boxes to check: face, then name, the role beneath it. */
.team-choices{gap:2px}
.team-choice{gap:12px}
.team-choice-name{display:grid;min-width:0;overflow-wrap:anywhere}
.team-choice-name small{color:var(--muted,#686577);font-size:.78rem}
.team-form .actions{display:flex;flex-wrap:wrap;gap:10px}
.team-form .actions .btn{min-height:44px}
.team-form .team-archive{margin-inline-start:auto}
.team-empty .actions{margin-top:14px}
[data-theme=dark] .team-card-head{color:inherit}
[data-theme=dark] .team-icon,[data-theme=dark] .team-person .team-lead-mark{background:#ffffff14}
@media(max-width:420px){.team-card-head{padding:14px;gap:12px}.team-who{padding:0 14px 14px}.team-form .team-archive{margin-inline-start:0}}
