/* Team pages and sheets use the app's colors, type and button styles. */
.team-page { max-width: 960px; margin: 0 auto; padding: 24px 16px; overflow-wrap: anywhere; }
.team-page h1 { margin-bottom: 16px; }
.team-page h2 { font-size: 1.2rem; }
.team-page p, .team-sheet p { margin: 12px 0; }
.team-seats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 20px 0; }
.team-card { min-width: 0; padding: 16px; margin-bottom: 12px; border: 1px solid var(--border, #ddd); border-radius: 12px; background: var(--surface, #fff); }
.team-list { margin: 24px 0; }
.team-badge { display: inline-block; padding: 4px 10px; border-radius: 20px; background: var(--bg-secondary, #eee); font-weight: 600; }
.team-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.team-page .btn, .team-sheet .btn { min-height: 44px; min-width: 44px; white-space: normal; max-width: 100%; margin: 4px 4px 4px 0; }
.team-sheet { position: fixed; inset: 0; margin: auto; width: min(560px, calc(100% - 24px)); max-height: calc(100dvh - 32px); padding: 24px; border: 1px solid var(--border, #ddd); border-radius: 16px; overflow-y: auto; overflow-wrap: anywhere; color: var(--text, #222); background: var(--surface, #fff); }
.team-sheet::backdrop { background: rgb(0 0 0 / 45%); }
.team-field { display: grid; gap: 8px; margin: 16px 0; }
.team-field input, .team-field select { width: 100%; min-width: 0; min-height: 44px; font-size: 16px; padding: 10px; }
.team-permissions { min-width: 0; padding: 12px; margin: 16px 0; border: 1px solid var(--border, #ddd); }
.team-toggle { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 8px 0; cursor: pointer; }
.team-toggle input { flex: 0 0 24px; width: 24px; height: 24px; }
.team-toggle:has(input:disabled) { cursor: not-allowed; opacity: .45; }
.team-crew-note { font-weight: 600; }
.team-notice { padding: 12px; border-left: 3px solid currentColor; }
.team-field[hidden], [data-permission][hidden], [data-owner-only][hidden], [data-team-hidden] { display: none !important; }
@media (max-width: 600px) { .team-seats { grid-template-columns: minmax(0, 1fr); gap: 0; } .team-sheet { padding: 16px; } }

.nav-btn[hidden], .workspace-tab[hidden] { display: none !important; }
