/* Team app ▸ Concierge (23.10.2026, team/teamConcierge.js). Only tokens (design-tokens.css, web3-design.css), colours
   mixed with color-mix, no hex. Accent = Web3 accent where the Web3 design is on, else the strongest text colour.
   Free room = --w3-positiv, occupied = --warning. Every rule is scoped to #teamConciergeView. */

#teamConciergeView {
  --tc-akzent: var(--w3-akzent, var(--text-1));
  --tc-akzent-text: var(--w3-akzent-text, var(--text-inv));
  --tc-positiv: var(--w3-positiv, var(--success));
  --tc-warnung: var(--w3-warnung, var(--warning));
  --tc-gefahr: var(--w3-negativ-text, var(--danger));
  --tc-karte: var(--w3-karte, var(--surface-1));
  --tc-kante: var(--w3-kante, inset 0 0 0 1px var(--border-1));
  --tc-glanz: var(--w3-glanz, none);
  --tc-fuellung: var(--w3-fuellung, var(--surface-2));
  --tc-fuellung-stark: var(--w3-fuellung-stark, var(--surface-3));
  --tc-rand: var(--w3-rand, var(--border-1));
  --tc-radius: var(--w3-radius-karte, var(--radius-lg));
}
/* Full width with the tab bar's edges (24.10.2026, docs/TEAM-APP.md „Layout“): no centered max-width. */
#teamConciergeView .tc-mount { box-sizing: border-box; width: 100%; padding: var(--space-6) 0 var(--space-9); color: var(--text-1); font-size: var(--fs-14); }
#teamConciergeView .tc-mount *, #teamConciergeView .tc-drawer-host * { box-sizing: border-box; }
#teamConciergeView .tc-seite { position: relative; display: flex; flex-direction: column; gap: var(--space-5); transition: opacity var(--t-base, .2s); }
#teamConciergeView .tc-mount.tc-laedt .tc-seite { opacity: .6; }
/* Page glow, once behind the head. */
#teamConciergeView .tc-seite::before {
  content: ""; position: absolute; z-index: -1; left: 0; right: 0; top: calc(-1 * var(--space-8)); height: 300px; pointer-events: none;
  background: radial-gradient(34% 50% at 26% 50%, color-mix(in srgb, var(--tc-akzent) 11%, transparent), transparent 70%);
}

/* ── No page head since 25.10.2026 (user): the area row comes first. „Dein Stammtisch“ uses the small label .tc-pfad. ── */
#teamConciergeView .tc-pfad { font-size: var(--fs-13); color: var(--text-3); }
#teamConciergeView :where(.tc-erklaerung, .tc-notiz-text) { max-width: 72ch; }
#teamConciergeView .tc-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); line-height: var(--lh-normal); }
/* Counters in the area row, like .tu-zaehler on the Userbetreuung page. */
#teamConciergeView .tc-bereich-zahl { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: var(--radius-pill); background: var(--w3-akzent-flaeche, var(--surface-3)); color: var(--tc-akzent); font-size: var(--fs-12); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-chip { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 var(--space-3); border-radius: var(--radius-pill); background: var(--tc-fuellung); color: var(--text-2); font-size: var(--fs-12); font-weight: var(--fw-medium); white-space: nowrap; }
#teamConciergeView .tc-chip .tc-sym { width: 14px; height: 14px; }
#teamConciergeView .tc-chip-positiv { background: color-mix(in srgb, var(--tc-positiv) 12%, transparent); color: var(--tc-positiv); }
#teamConciergeView .tc-chip-warnung { background: color-mix(in srgb, var(--tc-warnung) 14%, transparent); color: var(--tc-warnung); }
#teamConciergeView .tc-chip-aus { background: color-mix(in srgb, var(--text-3) 18%, transparent); color: var(--text-1); }

/* Live dot: 7 px, slow pulse; the script keeps its phase across redraws. */
#teamConciergeView .tc-live { display: inline-block; flex: none; width: 7px; height: 7px; border-radius: var(--radius-pill); background: var(--tc-positiv); box-shadow: 0 0 0 2px color-mix(in srgb, var(--tc-positiv) 25%, transparent); animation: tc-puls 2.4s ease-in-out infinite; }
#teamConciergeView .tc-live-leise { background: var(--text-2); box-shadow: 0 0 0 2px color-mix(in srgb, var(--text-2) 20%, transparent); animation: none; }
/* Same positive colour, no pulse (bot connected: a state, not a live event). */
#teamConciergeView .tc-live-ruhig { animation: none; }
@keyframes tc-puls { 0%, 100% { box-shadow: 0 0 0 2px color-mix(in srgb, var(--tc-positiv) 28%, transparent); } 50% { box-shadow: 0 0 0 5px color-mix(in srgb, var(--tc-positiv) 6%, transparent); } }

/* ── Notices ── */
#teamConciergeView .tc-hinweis { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; margin: 0; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--tc-fuellung); color: var(--text-1); font-size: var(--fs-13); }
#teamConciergeView .tc-hinweis-aus { background: color-mix(in srgb, var(--tc-akzent) 8%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-akzent) 30%, transparent); }
#teamConciergeView .tc-hinweis-warnung { background: var(--warning-soft); }
#teamConciergeView .tc-meldung { margin: 0; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: color-mix(in srgb, var(--tc-akzent) 8%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-akzent) 30%, transparent); font-size: var(--fs-13); }
#teamConciergeView .tc-meldung[hidden] { display: none; }
#teamConciergeView .tc-fehler { margin: 0; color: var(--tc-gefahr); font-size: var(--fs-13); }

/* Area row User | Onboarding | Concierge | Strategien | Einstellungen (24./25.10.2026): the same row as Team ▸
   Userbetreuung (.tu-tabs), so the pages read as one area. */
#teamConciergeView .tc-bereich { display: inline-flex; gap: 2px; width: fit-content; max-width: 100%; padding: 3px; border-radius: var(--radius-pill); background: var(--tc-fuellung); box-shadow: inset 0 0 0 1px var(--border-2); }
#teamConciergeView .tc-bereich-knopf { display: inline-flex; align-items: center; gap: var(--space-2); height: 36px; padding: 0 var(--space-4); border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--text-2); font: inherit; font-size: var(--fs-14); font-weight: var(--fw-medium); cursor: pointer; }
#teamConciergeView .tc-bereich-knopf:hover { color: var(--text-1); }
#teamConciergeView .tc-bereich-knopf[aria-selected="true"] { background: var(--tc-fuellung-stark); color: var(--text-1); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-bereich-knopf .tc-sym { width: 16px; height: 16px; }
#teamConciergeView .tc-reiter-zahl { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--radius-pill); background: var(--tc-akzent); color: var(--tc-akzent-text); font-size: var(--fs-11); font-weight: var(--fw-semibold); font-variant-numeric: tabular-nums; }

/* ── Kennzahlen strip with hairlines ── */
#teamConciergeView .tc-kennzahlen { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: var(--space-4) 0; border-radius: var(--tc-radius); background: var(--tc-karte); background-image: var(--tc-glanz); box-shadow: var(--tc-kante); }
#teamConciergeView .tc-kennzahl { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; padding: 0 var(--space-5); border-left: 1px solid var(--tc-rand); }
#teamConciergeView .tc-kennzahl:first-child { border-left: 0; }
#teamConciergeView .tc-kennzahl-wert { font-size: var(--fs-24); font-weight: var(--fw-semibold); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
#teamConciergeView .tc-kennzahl-label { font-size: var(--fs-12); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#teamConciergeView .tc-warnung { color: var(--tc-warnung); }

#teamConciergeView .tc-kennzahl-wert.tc-kennzahl-text { font-size: var(--fs-15); line-height: 1.6; color: var(--text-2); }

/* ── Rooms in parallel (24.10.2026): team marks, „kurz weg“ ── */
#teamConciergeView .tc-marke-team { height: 20px; background: color-mix(in srgb, var(--tc-positiv) 14%, transparent); color: var(--tc-positiv); }
#teamConciergeView .tc-belegt-wer { display: inline-flex; align-items: center; gap: var(--space-1); min-width: 0; }
#teamConciergeView .tc-raum-weg { display: flex; align-items: center; gap: 6px; margin: 0; font-size: var(--fs-12); color: var(--tc-warnung); }
#teamConciergeView .tc-raum-weg .tc-sym { width: 14px; height: 14px; flex: none; }
/* Settings: mode, fixed value, minutes per session */
#teamConciergeView .tc-feld.tc-parallel { gap: var(--space-4); }
#teamConciergeView .tc-parallel .tc-klein { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
#teamConciergeView .tc-stepper { display: inline-flex; align-items: center; gap: 2px; width: fit-content; padding: 2px; border-radius: var(--radius-pill); background: var(--tc-fuellung); box-shadow: var(--w3-kante-feld, inset 0 0 0 1px var(--border-2)); }
#teamConciergeView .tc-stepper-knopf { min-width: 32px; justify-content: center; padding: 0; border-radius: var(--radius-pill); box-shadow: none; font-size: var(--fs-17); }
#teamConciergeView .tc-stepper-wert { min-width: 64px; text-align: center; font-size: var(--fs-14); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-gemessen { gap: var(--space-2); }

/* ── Wartezimmer (25.10.2026, user: „Wartezimmer zeigt eigentlich die warteschlange links und rechts die stammtische“) ──
   The queue column is as wide as its rows (it ends after „Entfernen“; long concerns wrap at 46rem), the Stammtisch cards
   fill the rest. Two columns only from 1101 px: every column rule lives in this min-width query (lesson of the dep167
   hotfix: a column rule outside it made an implicit 13-px column on phones). Below: one column, queue first. */
#teamConciergeView .tc-raster-wz { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5); align-items: start; }
@media (min-width: 1101px) {
  /* User 26.10.2026: the Wartezimmer as wide as it can be, the six Stammtische on the right as 2 × 3 … */
  #teamConciergeView .tc-raster-wz { grid-template-columns: minmax(0, 1fr) minmax(0, 30rem); }
  #teamConciergeView .tc-raster-wz .tc-raumkarten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1700px) {
  /* … or 3 × 2 on wide screens. */
  #teamConciergeView .tc-raster-wz { grid-template-columns: minmax(0, 1fr) minmax(0, 50rem); }
  #teamConciergeView .tc-raster-wz .tc-raumkarten { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
#teamConciergeView .tc-raumkarten { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(14rem, 100%), 1fr)); gap: var(--space-4); }
#teamConciergeView .tc-raum.tc-raum-liste { min-height: 0; padding: var(--space-5); gap: var(--space-4); }
#teamConciergeView .tc-raum-liste .tc-karte-titel { font-size: var(--fs-17); }
#teamConciergeView .tc-raum-liste .tc-raum-leer { margin: 0; text-align: left; font-size: var(--fs-13); }
/* Narrow cards: the name keeps its room, „seit …“ moves below it instead of cutting the name. */
#teamConciergeView .tc-raum-liste .tc-belegt-zeile { flex-wrap: wrap; row-gap: 2px; }
#teamConciergeView .tc-raum-liste .tc-belegt-wer { min-width: min(100%, 12rem); }
/* The queue card has no size containment (25.10.2026): its column is as wide as its rows (fit-content), which an
   inline-size container would reduce to zero. Phones stack the row buttons (max-width: 640px below). */
#teamConciergeView .tc-anliegen { display: flex; align-items: flex-start; gap: 6px; margin: 0; font-size: var(--fs-13); color: var(--text-1); overflow-wrap: anywhere; }
#teamConciergeView .tc-anliegen .tc-sym { width: 14px; height: 14px; flex: none; margin-top: 2px; color: var(--text-3); }
#teamConciergeView .tc-anliegen-leer { color: var(--text-3); font-size: var(--fs-12); }
/* Concern with its lines (26.10.2026: several concerns one per line), „mehr“ / „weniger“ for long ones, pencil
   „Anliegen bearbeiten“ on a called ticket, the multi-line field (during the session and at „Concierge beenden“). */
#teamConciergeView .tc-anliegen-text, #teamConciergeView .tc-anliegen-text :is(.tc-text-kurz, .tc-text-voll) { white-space: pre-line; min-width: 0; }
#teamConciergeView .tc-mehr { white-space: nowrap; }
#teamConciergeView .tc-anliegen-stift { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 24px; height: 24px; margin-top: -2px; padding: 0; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--text-3); cursor: pointer; }
#teamConciergeView .tc-anliegen-stift .tc-sym { width: 14px; height: 14px; margin: 0; color: currentColor; }
#teamConciergeView .tc-anliegen-stift:hover:not(:disabled) { color: var(--text-1); background: var(--tc-fuellung); }
#teamConciergeView .tc-anliegen-stift:focus-visible { outline: none; box-shadow: var(--focus-ring); }
#teamConciergeView .tc-anliegen-stift:disabled { opacity: .5; cursor: default; }
/* A concern whose session ended while it was typed (review 26.10.2026): kept above the views until closed. */
#teamConciergeView .tc-anliegen-rest { display: flex; flex-direction: column; gap: var(--space-3); }
#teamConciergeView .tc-anliegen-rest-hinweis { margin: 0; font-size: var(--fs-13); color: var(--text-1); }
#teamConciergeView .tc-eingabe.tc-anliegen-feld { min-height: 6.5rem; resize: vertical; }
#teamConciergeView .tc-textknopf { padding: 0; border: 0; background: none; color: var(--tc-akzent); font: inherit; font-size: var(--fs-12); font-weight: var(--fw-medium); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, var(--tc-akzent) 40%, transparent); }
#teamConciergeView .tc-textknopf:hover { text-decoration-color: currentColor; }
#teamConciergeView .tc-eingabe.tc-eingabe-zeile { min-height: 38px; resize: none; }
#teamConciergeView .tc-mein-hinweis { justify-content: flex-start; flex-wrap: nowrap; }
#teamConciergeView .tc-mein-hinweis .tc-sym { width: 18px; height: 18px; flex: none; color: var(--text-2); }
#teamConciergeView .tc-mein-raum { --tc-a: var(--tc-positiv); gap: var(--space-4); }
#teamConciergeView .tc-mein-gespraech { --tc-a: var(--tc-akzent); }
#teamConciergeView .tc-mein-weg { --tc-a: var(--tc-warnung); }
#teamConciergeView .tc-mein-raum .tc-mein-titel { font-size: var(--fs-24); }
#teamConciergeView .tc-mein-team { display: flex; align-items: center; gap: var(--space-2); margin: 0; font-size: var(--fs-13); color: var(--text-2); }
#teamConciergeView .tc-mein-leer { padding: var(--space-3); border-radius: var(--radius-md); background: var(--tc-fuellung); text-align: center; }
#teamConciergeView .tc-gaeste { display: flex; flex-direction: column; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
#teamConciergeView .tc-gast { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: color-mix(in srgb, var(--tc-akzent) 7%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-akzent) 26%, transparent); }
#teamConciergeView .tc-gast-kopf { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); min-width: 0; }
#teamConciergeView .tc-timer { flex: none; font-size: var(--fs-20); font-weight: var(--fw-semibold); font-variant-numeric: tabular-nums; color: var(--text-1); }
#teamConciergeView .tc-gast-knoepfe { align-items: center; }
/* „Als Nächstes: <Name>“ on top of my Stammtisch (25.10.2026): who, where, how long, then „Profil öffnen“ and the move. */
#teamConciergeView .tc-naechster { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; padding: var(--space-4); border-radius: var(--radius-md); background: var(--tc-fuellung); box-shadow: inset 0 0 0 1px var(--tc-rand); }
#teamConciergeView .tc-naechster-person { display: flex; align-items: center; gap: var(--space-2) var(--space-3); flex-wrap: wrap; min-width: 0; }
#teamConciergeView .tc-naechster-person .tc-wartet { padding-top: 0; margin-left: auto; font-size: var(--fs-14); }
#teamConciergeView .tc-naechster-label { font-size: var(--fs-12); font-weight: var(--fw-semibold); color: var(--text-3); text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
#teamConciergeView .tc-naechster > .tc-aktion-knoepfe { justify-content: flex-start; margin-top: var(--space-1); }
#teamConciergeView .tc-naechster.tc-naechster-leer { justify-content: center; }
#teamConciergeView .tc-naechster .tc-knopf[aria-pressed="true"] { background: var(--tc-fuellung-stark); color: var(--text-1); }
/* „Zurück in die Warteschlange“: hold marker and the Team-only reason in the queue; the profile preview line. */
#teamConciergeView .tc-marke-warnung { background: color-mix(in srgb, var(--tc-warnung) 14%, transparent); color: var(--tc-warnung); }
#teamConciergeView .tc-zurueck-grund { margin: 0; font-size: var(--fs-12); color: var(--text-2); overflow-wrap: anywhere; }
#teamConciergeView .tc-profil-vorschau { display: flex; align-items: center; gap: var(--space-2); margin: 0; font-size: var(--fs-13); color: var(--text-2); }
#teamConciergeView .tc-profil-vorschau .tc-sym { color: var(--text-3); }
#teamConciergeView .tc-zustand { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 var(--space-2); border-radius: var(--radius-pill); font-size: var(--fs-12); font-weight: var(--fw-medium); white-space: nowrap; background: var(--tc-fuellung); color: var(--text-3); }
#teamConciergeView .tc-zustand-punkt { width: 7px; height: 7px; border-radius: var(--radius-pill); background: currentColor; }
#teamConciergeView .tc-zustand-bereit { background: color-mix(in srgb, var(--tc-positiv) 13%, transparent); color: var(--tc-positiv); }
#teamConciergeView .tc-zustand-gespraech { background: color-mix(in srgb, var(--tc-akzent) 15%, transparent); color: var(--tc-akzent); }
#teamConciergeView .tc-zustand-weg { background: color-mix(in srgb, var(--tc-warnung) 14%, transparent); color: var(--tc-warnung); }
/* The guest's profile in my Stammtisch (25.10.2026; team/teamUserbetreuung.js profilIn mirrors the Userbetreuung styles
   under .tu-gast). The room card holds a long profile: it does not lift on hover (the profile's toast is fixed to the
   viewport and a transformed ancestor would carry it along). */
#teamConciergeView .tc-mount .tc-mein-raum:hover { transform: none; }
#teamConciergeView .tc-gast-gezeigt { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--tc-akzent) 55%, transparent); }
#teamConciergeView .tc-gast-knoepfe .tc-knopf[aria-pressed="true"] { background: var(--tc-fuellung-stark); color: var(--text-1); }
#teamConciergeView .tc-profil-bereich { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; padding-top: var(--space-4); border-top: 1px solid var(--tc-rand); }
#teamConciergeView .tc-profil-gast { min-width: 0; }
#teamConciergeView .tc-profil-sperre { justify-content: flex-start; flex-wrap: nowrap; margin: 0; }
#teamConciergeView .tc-profil-sperre .tc-sym { width: 18px; height: 18px; flex: none; color: var(--text-2); }
#teamConciergeView .tc-profil-entwurf { align-items: center; }
#teamConciergeView .tu-gast { font-size: var(--fs-14); line-height: 1.45; color: var(--text-1); }
/* The profile's cards in two columns from 720 px of profile width (the User tab: 880 px next to its list). One class more than
   the mirrored rules, which come later in the cascade (adopted stylesheet). */
@container tu-profil (min-width: 720px) {
  /* Two independent stacks like the User tab (tu-profil-links | tu-profil-rechts, 26.10.2026): no shared rows. */
  #teamConciergeView .tc-profil-gast .tu-gast .tu-profil-raster { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Compact: the guest's name and picture stand above already, so the profile head is smaller. */
#teamConciergeView .tu-gast.tu-gast-kompakt .tu-profil-name h2 { font-size: var(--fs-17); }
#teamConciergeView .tu-gast.tu-gast-kompakt .tu-avatar-gross { width: 40px; height: 40px; font-size: var(--fs-14); }

/* ── Grid and cards ── */
#teamConciergeView .tc-raster { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-5); align-items: start; }
/* Running text keeps a readable line length on wide screens (low specificity: own max-widths win). */
#teamConciergeView .tc-spalte { display: flex; flex-direction: column; gap: var(--space-5); min-width: 0; }
#teamConciergeView .tc-karte {
  --tc-a: var(--tc-akzent);
  position: relative; display: flex; flex-direction: column; gap: var(--space-4); min-width: 0;
  padding: var(--space-5); border-radius: var(--tc-radius); background-color: var(--tc-karte);
  background-image: linear-gradient(46deg, color-mix(in srgb, var(--tc-a) 8%, transparent) -6%, transparent 60%), var(--tc-glanz);
  box-shadow: var(--tc-kante);
  transition: transform var(--t-base, .2s) cubic-bezier(.4, 0, .2, 1), box-shadow var(--t-base, .2s);
}
#teamConciergeView .tc-mount .tc-karte:hover { transform: translateY(-2px); }
#teamConciergeView .tc-karte-kopf { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }
#teamConciergeView .tc-karte-titel { display: flex; align-items: center; gap: var(--space-2); margin: 0; font-size: var(--fs-15); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-zaehler { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: var(--radius-pill); background: color-mix(in srgb, var(--tc-akzent) 14%, transparent); color: var(--tc-akzent); font-size: var(--fs-12); font-weight: var(--fw-semibold); font-variant-numeric: tabular-nums; }
#teamConciergeView .tc-zaehler-leise { background: var(--tc-fuellung); color: var(--text-2); }
#teamConciergeView .tc-erklaerung { margin: calc(-1 * var(--space-2)) 0 0; font-size: var(--fs-13); color: var(--text-2); }
#teamConciergeView .tc-klein { margin: 0; font-size: var(--fs-12); color: var(--text-3); }
#teamConciergeView .tc-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
#teamConciergeView .tc-sym { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

/* ── Buttons ── */
#teamConciergeView .tc-knopf {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 34px; padding: 0 var(--space-4); border: 0; border-radius: var(--radius-pill);
  background: var(--tc-fuellung); box-shadow: var(--w3-kante-feld, inset 0 0 0 1px var(--border-2));
  color: var(--text-1); font: inherit; font-size: var(--fs-13); font-weight: var(--fw-medium); white-space: nowrap; cursor: pointer;
  transition: background var(--t-fast, .12s), color var(--t-fast, .12s), filter var(--t-fast, .12s);
}
#teamConciergeView .tc-knopf:hover { background: var(--tc-fuellung-stark); }
#teamConciergeView .tc-knopf:disabled { opacity: .45; cursor: default; }
#teamConciergeView .tc-knopf-klein { height: 30px; padding: 0 var(--space-3); font-size: var(--fs-12); }
#teamConciergeView .tc-knopf-primaer { background: var(--tc-akzent); color: var(--tc-akzent-text); box-shadow: none; font-weight: var(--fw-semibold); }
#teamConciergeView .tc-knopf-primaer:hover:not(:disabled) { background: var(--tc-akzent); filter: brightness(1.08); }
#teamConciergeView .tc-knopf-leise { background: transparent; box-shadow: none; color: var(--text-2); }
#teamConciergeView .tc-knopf-leise:hover:not(:disabled) { background: var(--tc-fuellung); color: var(--text-1); }
#teamConciergeView .tc-knopf-leise-gefahr:hover:not(:disabled) { color: var(--tc-gefahr); }
#teamConciergeView .tc-knopf-gefahr { background: color-mix(in srgb, var(--danger) 16%, transparent); box-shadow: none; color: var(--tc-gefahr); }
#teamConciergeView .tc-knopf-gefahr:hover:not(:disabled) { background: color-mix(in srgb, var(--danger) 24%, transparent); }
#teamConciergeView .tc-knopf.tc-laeuft::after { content: ""; width: 12px; height: 12px; border: 2px solid currentColor; border-right-color: transparent; border-radius: var(--radius-pill); animation: tc-dreh .8s linear infinite; }
@keyframes tc-dreh { to { transform: rotate(360deg); } }
#teamConciergeView .tc-symbol-knopf { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 32px; height: 32px; padding: 0; border: 0; border-radius: var(--radius-pill); background: var(--tc-fuellung); color: var(--text-1); cursor: pointer; }
#teamConciergeView .tc-symbol-knopf:hover { background: var(--tc-fuellung-stark); }
#teamConciergeView .tc-knopf:focus-visible,
#teamConciergeView .tc-symbol-knopf:focus-visible,
#teamConciergeView .tc-bereich-knopf:focus-visible,
#teamConciergeView .tc-person:focus-visible,
#teamConciergeView .tc-raum-klickbar:focus-visible,
#teamConciergeView .tc-segment button:focus-visible,
#teamConciergeView .tc-dd-knopf:focus-visible,
#teamConciergeView .tc-dd-menue:focus-visible,
#teamConciergeView .tc-eingabe:focus-visible { outline: none; box-shadow: var(--focus-ring); }

/* ── Segmented control: the one Team app style (Verwaltung .tv-unterleiste "Rechte | Funktionen") – dark pill frame,
   the chosen value on the stronger fill, never the accent (design review 24.10.2026). ── */
#teamConciergeView .tc-segment { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 2px; width: fit-content; max-width: 100%; border-radius: var(--radius-pill); background: var(--tc-fuellung); box-shadow: var(--w3-kante-feld, inset 0 0 0 1px var(--border-2)); }
#teamConciergeView .tc-segment button { position: relative; min-width: 36px; height: 32px; padding: 0 var(--space-3); border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--text-2); font: inherit; font-size: var(--fs-13); font-variant-numeric: tabular-nums; cursor: pointer; }
#teamConciergeView .tc-segment button:hover:not(:disabled) { color: var(--text-1); }
#teamConciergeView .tc-segment button[aria-checked="true"] { background: var(--tc-fuellung-stark); color: var(--text-1); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-segment button:disabled { opacity: .35; cursor: default; }
#teamConciergeView .tc-segment .tc-seg-belegt::after { content: ""; position: absolute; top: 4px; right: 5px; width: 5px; height: 5px; border-radius: var(--radius-pill); background: var(--warning); }

/* ── Queue ── */
#teamConciergeView .tc-schlange { display: flex; flex-direction: column; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
/* The full queue fits the screen (25.10.2026, user: lists fit the screen, teamConcierge.js passeListen → team/teamListen.js):
   mode „Scrollen“ = the box reaches the bottom of the viewport and scrolls inside (deliberate exception to "panels never
   scroll"; max-height set inline), mode „Seiten“ = the rows that fit plus the pager. Padding keeps the focus rings in. */
#teamConciergeView .tc-schlange-passend.tl-scroll { padding: 2px; margin: -2px; }
#teamConciergeView .tc-schlange-passend:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-md); }
#teamConciergeView .tc-seitenliste { display: flex; flex-direction: column; gap: var(--space-3); }
#teamConciergeView .tc-seiten-fuss { margin-top: var(--space-1); }
#teamConciergeView .tc-zeile { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--tc-fuellung); box-shadow: inset 0 0 0 1px var(--tc-rand); }
#teamConciergeView .tc-zeile-dran { background: color-mix(in srgb, var(--tc-akzent) 7%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-akzent) 30%, transparent); }
/* Round 3 (user, d5819b53): place, person, and the four buttons stacked on the right in one equal-width column. */
#teamConciergeView .tc-zeile-haupt { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: var(--space-3); min-width: 0; }
#teamConciergeView .tc-platz { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 32px; height: 32px; border-radius: var(--radius-pill); background: var(--tc-fuellung-stark); color: var(--text-1); font-size: var(--fs-14); font-weight: var(--fw-semibold); font-variant-numeric: tabular-nums; }
#teamConciergeView .tc-zeile-dran .tc-platz { background: var(--tc-akzent); color: var(--tc-akzent-text); }
#teamConciergeView .tc-zeile-person { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
#teamConciergeView .tc-zeile-name { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; min-width: 0; }
#teamConciergeView .tc-zeile-meta { display: flex; flex-wrap: wrap; gap: 4px var(--space-3); font-size: var(--fs-12); color: var(--text-2); }
#teamConciergeView .tc-meta-frf { display: inline-flex; align-items: center; gap: 4px; color: var(--text-1); }
#teamConciergeView .tc-meta-frf .tc-sym { width: 13px; height: 13px; color: var(--text-3); }
#teamConciergeView .tc-meta-leise { color: var(--text-3); font-size: var(--fs-12); }
#teamConciergeView .tc-im-raum { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-12); color: var(--tc-positiv); }
#teamConciergeView .tc-wartet { flex: none; font-size: var(--fs-15); font-weight: var(--fw-semibold); color: var(--text-1); padding-top: 6px; }
#teamConciergeView .tc-wartet.tc-warnung { color: var(--tc-warnung); }
#teamConciergeView .tc-marken { display: flex; flex-wrap: wrap; gap: var(--space-2); }
#teamConciergeView .tc-marken:empty { display: none; }
#teamConciergeView .tc-marke { display: inline-flex; align-items: center; height: 22px; padding: 0 var(--space-2); border-radius: var(--radius-pill); background: var(--tc-fuellung-stark); color: var(--text-2); font-size: var(--fs-11); font-weight: var(--fw-medium); white-space: nowrap; }
#teamConciergeView .tc-voice-rechts { display: inline-flex; align-items: center; gap: var(--space-2); flex: none; margin-left: auto; }
#teamConciergeView .tc-marke-akzent { background: color-mix(in srgb, var(--tc-akzent) 16%, transparent); color: var(--tc-akzent); }
#teamConciergeView .tc-marke-positiv { background: color-mix(in srgb, var(--tc-positiv) 14%, transparent); color: var(--tc-positiv); }
#teamConciergeView .tc-marke-gefahr { background: color-mix(in srgb, var(--danger) 14%, transparent); color: var(--tc-gefahr); white-space: normal; height: auto; min-height: 22px; }
#teamConciergeView .tc-zeile-knoepfe, #teamConciergeView .tc-aktion-knoepfe { display: flex; flex-wrap: wrap; gap: var(--space-2); }
#teamConciergeView .tc-zeile-knoepfe { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-1); width: 11.5rem; }
#teamConciergeView .tc-zeile-knoepfe .tc-knopf { width: 100%; justify-content: flex-start; }
#teamConciergeView .tc-aktion-knoepfe { justify-content: flex-end; }
#teamConciergeView .tc-aktion-feld { display: flex; flex-direction: column; gap: var(--space-3); margin-left: calc(32px + var(--space-3)); padding: var(--space-3); border-radius: var(--radius-md); background: var(--tc-karte); box-shadow: inset 0 0 0 1px var(--tc-rand); }
#teamConciergeView .tc-aktion-gefahr { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--danger) 35%, transparent); }

/* Person button (opens the profile) */
#teamConciergeView .tc-person { display: inline-flex; align-items: center; gap: var(--space-2); min-width: 0; max-width: 100%; padding: 2px var(--space-2) 2px 2px; border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--text-1); font: inherit; font-size: var(--fs-14); font-weight: var(--fw-medium); text-align: left; cursor: pointer; transition: background var(--t-fast, .12s); }
#teamConciergeView .tc-person:hover { background: var(--tc-fuellung-stark); }
#teamConciergeView .tc-person-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#teamConciergeView .tc-person-gross { font-size: var(--fs-15); }
#teamConciergeView .tc-avatar { position: relative; display: inline-flex; align-items: center; justify-content: center; flex: none; width: 28px; height: 28px; overflow: hidden; border-radius: var(--radius-pill); background: color-mix(in srgb, var(--tc-akzent) 18%, var(--tc-fuellung-stark)); color: var(--text-1); font-size: var(--fs-11); font-weight: var(--fw-semibold); letter-spacing: .02em; }
#teamConciergeView .tc-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
#teamConciergeView .tc-avatar-gross { width: 44px; height: 44px; font-size: var(--fs-14); }
#teamConciergeView .tc-person-gross .tc-avatar { width: 36px; height: 36px; font-size: var(--fs-12); }

/* ── Rooms ── */
#teamConciergeView .tc-raeume { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
#teamConciergeView .tc-raum-huelle { display: flex; min-width: 0; }
#teamConciergeView .tc-raum { flex: 1; gap: var(--space-3); padding: var(--space-4); }
#teamConciergeView .tc-raum-frei { --tc-a: var(--tc-positiv); }
#teamConciergeView .tc-raum-belegt { --tc-a: var(--warning); }
#teamConciergeView .tc-raum-klickbar { cursor: pointer; }
#teamConciergeView .tc-raum-kopf { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); flex-wrap: wrap; }
#teamConciergeView .tc-raum .tc-karte-titel { font-size: var(--fs-14); }
#teamConciergeView .tc-raum-gross .tc-karte-titel { font-size: var(--fs-20); }
/* Title = role ("Stammtisch 1"); the Discord channel only as a small sub-line. */
#teamConciergeView .tc-raum-titelblock { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
#teamConciergeView .tc-kanal { font-size: var(--fs-12); color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#teamConciergeView .tc-raum-status { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-12); font-weight: var(--fw-medium); color: var(--tc-a); white-space: nowrap; }
#teamConciergeView .tc-raum-punkt { width: 7px; height: 7px; border-radius: var(--radius-pill); background: var(--tc-a); }
#teamConciergeView .tc-raum-leer { margin: 0; font-size: var(--fs-13); color: var(--text-3); }
#teamConciergeView .tc-raum-gross { gap: var(--space-5); padding: var(--space-6); min-height: 280px; }
#teamConciergeView .tc-raum-gross .tc-raum-leer { margin: auto 0; text-align: center; font-size: var(--fs-14); }
#teamConciergeView .tc-belegt-liste { display: flex; flex-direction: column; gap: var(--space-1); margin: 0; padding: 0; list-style: none; }
#teamConciergeView .tc-belegt-zeile { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2); min-width: 0; }
#teamConciergeView .tc-raum-gross .tc-belegt-zeile { padding: var(--space-2); border-radius: var(--radius-md); background: var(--tc-fuellung); }
#teamConciergeView .tc-seit { flex: none; font-size: var(--fs-12); color: var(--text-2); white-space: nowrap; }
#teamConciergeView .tc-erledigt { display: flex; flex-direction: column; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
#teamConciergeView .tc-erledigt li { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--space-3); row-gap: 2px; align-items: baseline; }
#teamConciergeView .tc-erledigt li > :last-child { grid-column: 2; }
/* „Heute erledigt“ with many entries in mode „Scrollen“: a box of about eight rows (pages of eight in mode „Seiten“). */
/* Phones (≤ 640 px, like team/teamListen.js): no inner scroll box, the page scrolls. */
@media (min-width: 641px) { #teamConciergeView .tc-erledigt-lang { max-height: calc(8 * 2.9rem); padding-right: var(--space-1); } }
@media (max-width: 640px) { #teamConciergeView .tc-erledigt-lang { overflow: visible; } }
#teamConciergeView .tc-erledigt-lang:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-md); }
#teamConciergeView .tc-erledigt-name { font-weight: var(--fw-medium); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* „Tagesverlauf“ (26.10.2026): four tabs (tab row in the segment look), each entry time | person, then badge + context. */
#teamConciergeView .tc-segment button[role="tab"][aria-selected="true"] { background: var(--tc-fuellung-stark); color: var(--text-1); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-verlauf-reiter { display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); width: 100%; border-radius: var(--radius-lg); }
#teamConciergeView .tc-verlauf-reiter button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); height: auto; min-height: 32px; padding: var(--space-1) var(--space-2); border-radius: var(--radius-md); line-height: 1.2; text-align: center; }
#teamConciergeView .tc-verlauf-zahl { color: var(--text-3); font-size: var(--fs-12); font-weight: var(--fw-medium); }
#teamConciergeView .tc-verlauf-reiter button[aria-selected="true"] .tc-verlauf-zahl { color: var(--text-2); }
#teamConciergeView .tc-erledigt .tc-erledigt-person { justify-self: start; }
#teamConciergeView .tc-verlauf-kontext { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-2); min-width: 0; color: var(--text-2); }
#teamConciergeView .tc-verlauf-kontext .tc-marke { height: 20px; }
#teamConciergeView .tc-verlauf-kontext > span:last-child:empty { display: none; }
#teamConciergeView .tc-verlauf-leer { margin: 0; color: var(--text-2); }

/* ── Settings ── */
#teamConciergeView .tc-felder { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
#teamConciergeView .tc-feld { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
#teamConciergeView .tc-feld-label { font-size: var(--fs-12); font-weight: var(--fw-medium); color: var(--text-2); }
#teamConciergeView .tc-eingabe { width: 100%; min-height: 64px; padding: var(--space-3); border: 0; border-radius: var(--radius-md); background: var(--input-bg); box-shadow: inset 0 0 0 1px var(--input-border); color: var(--text-1); font: inherit; font-size: var(--fs-13); resize: vertical; }
#teamConciergeView .tc-eingabe::placeholder { color: var(--input-placeholder); }

/* Dropdown (catalogue Dropdown/standard, tokens instead of hex) */
#teamConciergeView .tc-dd { position: relative; min-width: 0; }
#teamConciergeView .tc-dd-knopf { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); width: 100%; height: 38px; padding: 0 var(--space-3) 0 var(--space-4); border: 0; border-radius: var(--w3-radius-feld, var(--radius-md)); background: var(--input-bg); box-shadow: inset 0 0 0 1px var(--input-border); color: var(--text-1); font: inherit; font-size: var(--fs-13); text-align: left; cursor: pointer; }
#teamConciergeView .tc-dd-knopf:hover { box-shadow: inset 0 0 0 1px var(--border-3); }
#teamConciergeView .tc-dd-wert { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#teamConciergeView .tc-dd-leer { color: var(--input-placeholder); }
#teamConciergeView .tc-dd-pfeil { color: var(--text-3); transition: transform var(--t-fast, .12s); }
#teamConciergeView .tc-dd.ist-offen .tc-dd-pfeil { transform: rotate(180deg); }
#teamConciergeView .tc-dd-menue { position: absolute; z-index: var(--z-dropdown); top: calc(100% + 6px); left: 0; right: 0; max-height: 280px; overflow-y: auto; padding: var(--space-1); border-radius: var(--radius-md); background: var(--w3-popover, var(--surface-2)); box-shadow: var(--shadow-md), inset 0 0 0 1px var(--border-2); }
#teamConciergeView .tc-dd-menue[hidden] { display: none; }
#teamConciergeView .tc-dd-option { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "text haken" "sub haken"; align-items: center; column-gap: var(--space-2); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); cursor: pointer; }
#teamConciergeView .tc-dd-option:hover, #teamConciergeView .tc-dd-option.ist-aktiv { background: var(--tc-fuellung-stark); }
#teamConciergeView .tc-dd-text { grid-area: text; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-13); }
#teamConciergeView .tc-dd-sub { grid-area: sub; font-size: var(--fs-11); color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#teamConciergeView .tc-dd-haken { grid-area: haken; color: var(--check, var(--tc-akzent)); }
#teamConciergeView .tc-dd-nichts { padding: var(--space-3); font-size: var(--fs-13); color: var(--text-3); }

/* ── Empty state (catalogue EmptyState/standard) ── */
#teamConciergeView .tc-leer { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); padding: var(--space-8) var(--space-4); text-align: center; }
#teamConciergeView .tc-leer-symbol { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: var(--radius-pill); background: var(--tc-fuellung); box-shadow: inset 0 0 0 1px var(--border-2); color: var(--text-2); }
#teamConciergeView .tc-leer-symbol .tc-sym { width: 22px; height: 22px; }
#teamConciergeView .tc-leer-titel { margin: 0; font-size: var(--fs-15); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-leer-text { margin: 0; max-width: 360px; font-size: var(--fs-13); color: var(--text-2); }

/* ── Skeleton (first load only) ── */
#teamConciergeView .tc-skelett { display: flex; flex-direction: column; gap: var(--space-5); }
#teamConciergeView .tc-sk-raster { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-5); }
#teamConciergeView .tc-sk { border-radius: var(--tc-radius); background: var(--tc-fuellung); animation: tc-sk 1.4s ease-in-out infinite alternate; }
#teamConciergeView .tc-sk-streifen { height: 84px; }
#teamConciergeView .tc-sk-gross { height: 360px; }
@keyframes tc-sk { to { opacity: .55; } }

/* ── Drawer (catalogue Drawer/standard, right) ── */
#teamConciergeView .tc-drawer-schleier { position: fixed; inset: 0; z-index: var(--z-drawer); background: var(--overlay); }
#teamConciergeView .tc-drawer {
  position: fixed; z-index: calc(var(--z-drawer) + 1); top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(460px, 100vw);
  background: var(--w3-flaeche, var(--surface-1)); box-shadow: var(--shadow-lg); border-left: 1px solid var(--tc-rand); color: var(--text-1); font-size: var(--fs-14);
}
#teamConciergeView .tc-drawer-rein.tc-drawer { animation: tc-drawer-rein var(--t-base, .2s) cubic-bezier(.4, 0, .2, 1); }
#teamConciergeView .tc-drawer-rein.tc-drawer-schleier { animation: tc-schleier var(--t-base, .2s) ease-out; }
@keyframes tc-drawer-rein { from { transform: translateX(24px); opacity: 0; } }
@keyframes tc-schleier { from { opacity: 0; } }
#teamConciergeView .tc-drawer-kopf { position: relative; display: flex; align-items: center; gap: var(--space-3); padding: var(--space-5); border-bottom: 1px solid var(--tc-rand); }
#teamConciergeView .tc-drawer-kopf-text { flex: 1; min-width: 0; }
#teamConciergeView .tc-drawer-kopf h3 { margin: 0; font-size: var(--fs-17); font-weight: var(--fw-semibold); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#teamConciergeView .tc-drawer-koerper { flex: 1; display: flex; flex-direction: column; gap: var(--space-6); overflow-y: auto; padding: var(--space-5); }
#teamConciergeView .tc-drawer-abschnitt { display: flex; flex-direction: column; gap: var(--space-3); }
#teamConciergeView .tc-drawer-abschnitt h4 { display: flex; align-items: center; gap: var(--space-2); margin: 0; font-size: var(--fs-12); font-weight: var(--fw-medium); color: var(--text-3); text-transform: uppercase; letter-spacing: .04em; }
/* Discord ID: no raw number on show, only a small copy button with inline confirmation. */
#teamConciergeView .tc-id-zeile { display: flex; align-items: center; margin-top: calc(-1 * var(--space-1)); }
#teamConciergeView .tc-id-knopf { height: 28px; margin-left: calc(-1 * var(--space-2)); padding: 0 var(--space-2); color: var(--text-3); }
#teamConciergeView .tc-id-knopf .tc-sym { width: 14px; height: 14px; }
#teamConciergeView .tc-id-knopf.tc-kopiert, #teamConciergeView .tc-id-knopf.tc-kopiert:hover { color: var(--tc-positiv); }
#teamConciergeView .tc-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
#teamConciergeView .tc-profil-frf { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3); border-radius: var(--radius-md); background: var(--tc-fuellung); }
#teamConciergeView .tc-verlauf, #teamConciergeView .tc-notizen { display: flex; flex-direction: column; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
#teamConciergeView .tc-verlauf li { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--space-3); row-gap: 2px; align-items: center; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); background: var(--tc-fuellung); }
#teamConciergeView .tc-verlauf li > .tc-marke { grid-row: 1 / span 2; grid-column: 2; }
#teamConciergeView .tc-verlauf-tag { font-weight: var(--fw-medium); font-variant-numeric: tabular-nums; }
#teamConciergeView .tc-notizen li { display: flex; flex-direction: column; gap: 4px; padding: var(--space-3); border-radius: var(--radius-md); background: var(--tc-fuellung); }
#teamConciergeView .tc-notiz-text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--fs-13); }

/* ── Staggered entrance: only the first render, never on a poll ── */
#teamConciergeView .tc-erst [style*="--i"] { animation: tc-rein .42s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(var(--i, 0) * 45ms); }
@keyframes tc-rein { from { opacity: 0; transform: translateY(8px); } }

/* ── Wide (full width, 24.10.2026) ── Wide screens: the side column (rooms, voice channel) gets as much room as the queue. */
@media (min-width: 1760px) {
  #teamConciergeView .tc-raster, #teamConciergeView .tc-sk-raster { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  /* Six rooms as 3 × 2 instead of 2 × 3 (fits the six Stammtisch rooms evenly). */
  #teamConciergeView .tc-raeume { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ── Phones ── */
@media (max-width: 1024px) {
  #teamConciergeView .tc-raster, #teamConciergeView .tc-sk-raster { grid-template-columns: minmax(0, 1fr); }
  /* Tablets (responsive pass 25.10.2026): the stat label „Wartezeit neue Nummer“ was cut; it may wrap, with less side padding. */
  #teamConciergeView .tc-kennzahl { padding: 0 var(--space-4); }
  #teamConciergeView .tc-kennzahl-label { white-space: normal; }
  #teamConciergeView .tc-raeume { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  #teamConciergeView .tc-mount { padding: var(--space-4) 0 var(--space-8); }
  #teamConciergeView .tc-seite { gap: var(--space-4); }
  /* Up to five entries (25.10.2026): the row wraps instead of running off the screen. */
  #teamConciergeView .tc-bereich { display: flex; flex-wrap: wrap; width: 100%; border-radius: var(--radius-lg); }
  #teamConciergeView .tc-bereich-knopf { flex: 1 1 auto; justify-content: center; padding: 0 var(--space-2); }
  /* Einstellungen: only its gear on phones, so the row fits (its name stays for screen readers). */
  #teamConciergeView .tc-bereich-knopf[data-tc-bereich="einstellungen"] { flex: 0 0 auto; padding: 0 var(--space-3); font-size: 0; gap: 0; }
  #teamConciergeView .tc-kennzahlen { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--space-4); }
  #teamConciergeView .tc-kennzahl { padding: 0 var(--space-4); }
  #teamConciergeView .tc-kennzahl:nth-child(3) { border-left: 0; }
  #teamConciergeView .tc-kennzahl:nth-child(n+3) { padding-top: var(--space-4); border-top: 1px solid var(--tc-rand); }
  #teamConciergeView .tc-kennzahl-wert { font-size: var(--fs-20); }
  #teamConciergeView .tc-raeume { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* Narrow room cards: name on its own line, the time below (no clipped names). */
  #teamConciergeView .tc-raum:not(.tc-raum-gross) .tc-belegt-zeile { flex-direction: column; align-items: flex-start; gap: 0; }
  #teamConciergeView .tc-raum:not(.tc-raum-gross) .tc-seit { padding-left: calc(28px + var(--space-3)); }
  #teamConciergeView .tc-felder { grid-template-columns: minmax(0, 1fr); }
  #teamConciergeView .tc-gast { padding: var(--space-3); }
  #teamConciergeView .tc-gast-knoepfe { display: grid; grid-template-columns: minmax(0, 1fr); }
  #teamConciergeView .tc-naechster > .tc-aktion-knoepfe { display: grid; grid-template-columns: minmax(0, 1fr); }
  #teamConciergeView .tc-karte { padding: var(--space-4); }
  #teamConciergeView .tc-zeile { padding: var(--space-3); }
  /* Row actions: the main action on its own line, "Fertig" + "Entfernen" side by side below it. */
  /* Row buttons below the person, two by two (the place stays left of the person). */
  #teamConciergeView .tc-zeile-haupt { grid-template-columns: auto minmax(0, 1fr); }
  #teamConciergeView .tc-zeile-knoepfe { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); width: auto; }
  #teamConciergeView .tc-zeile-knoepfe .tc-knopf { justify-content: center; }
  #teamConciergeView .tc-aktion-feld { margin-left: 0; }
  #teamConciergeView .tc-drawer { width: 100vw; border-left: 0; }
}

/* ── Einstellungen ▸ Chats aufräumen (25.10.2026): switch + destructive button in one wrapping row ── */
#teamConciergeView .tc-aufraeumen-leiste { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); }
#teamConciergeView .tc-aufraeumen-frage { margin-left: 0; }
#teamConciergeView .tc-aufraeumen-fehler { font-size: var(--fs-12); }
#teamConciergeView .tc-aufraeumen .tc-klein .tc-live { margin-right: 2px; vertical-align: middle; }
#teamConciergeView .tc-schalter { position: relative; display: inline-flex; align-items: center; gap: var(--space-3); min-height: 32px; min-width: 0; font-size: var(--fs-13); color: var(--text-1); cursor: pointer; }
#teamConciergeView .tc-schalter > span:last-child { min-width: 0; overflow-wrap: anywhere; }
#teamConciergeView .tc-schalter input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
#teamConciergeView .tc-spur { position: relative; flex: none; width: 34px; height: 20px; border-radius: var(--radius-pill); background: var(--tc-fuellung-stark); box-shadow: inset 0 0 0 1px var(--border-2); transition: background var(--t-fast, .12s); }
#teamConciergeView .tc-spur::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: var(--radius-pill); background: var(--text-2); transition: transform var(--t-fast, .12s); }
#teamConciergeView .tc-schalter input:checked + .tc-spur { background: color-mix(in srgb, var(--tc-positiv) 22%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-positiv) 45%, transparent); }
#teamConciergeView .tc-schalter input:checked + .tc-spur::after { transform: translateX(14px); background: var(--tc-positiv); }
#teamConciergeView .tc-schalter input:focus-visible + .tc-spur { box-shadow: var(--focus-ring); }
#teamConciergeView .tc-schalter.tc-gesperrt { opacity: .6; cursor: default; }

/* ── Motion off ── */
@media (prefers-reduced-motion: reduce) {
  #teamConciergeView .tc-erst [style*="--i"],
  #teamConciergeView .tc-live,
  #teamConciergeView .tc-sk,
  #teamConciergeView .tc-drawer-rein,
  #teamConciergeView .tc-knopf.tc-laeuft::after { animation: none; }
  #teamConciergeView .tc-spur, #teamConciergeView .tc-spur::after { transition: none; }
  #teamConciergeView .tc-karte,
  #teamConciergeView .tc-seite { transition: none; }
  #teamConciergeView .tc-mount .tc-karte:hover { transform: none; }
}

/* ── „Stammtisch beitreten“ (25.10.2026): button at the bottom of a Stammtisch card, notice with the Discord link ── */
#teamConciergeView .tc-beitreten { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); margin-top: auto; }
#teamConciergeView .tc-beitreten-knoepfe { display: flex; flex-wrap: wrap; gap: var(--space-2); }
#teamConciergeView .tc-beitreten-da { display: flex; align-items: center; gap: 6px; margin: 0; font-size: var(--fs-13); color: var(--text-2); }
#teamConciergeView .tc-beitreten-da .tc-sym { width: 14px; height: 14px; }
#teamConciergeView .tc-beitreten-hinweis { align-self: stretch; }
#teamConciergeView .tc-beitreten-hinweis > span { flex: 1 1 16rem; min-width: 0; }
#teamConciergeView a.tc-knopf { text-decoration: none; }

/* ── Round 3 (26.10.2026, user, PLAN-concierge-r3.md B1–B9) ── */
/* Status line: office hour and bot chips, „Statistik“ on the right. */
#teamConciergeView .tc-status { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-3); }
#teamConciergeView .tc-status .tc-chip { height: 26px; }
/* Queue entry: the concern readable under the name, „x. Besuch · gezogen · Profil öffnen“ at the bottom. */
#teamConciergeView .tc-zeile .tc-anliegen { font-size: var(--fs-14); line-height: var(--lh-normal, 1.45); }
#teamConciergeView .tc-zeile .tc-anliegen-leer { font-size: var(--fs-12); }
#teamConciergeView .tc-zeile-name .tc-wartet { margin-left: auto; padding-top: 0; }
#teamConciergeView .tc-zeile-meta { align-items: center; gap: 2px var(--space-2); }
/* The dot ends the previous item, so a wrapped line never starts with it. */
#teamConciergeView .tc-zeile-meta > :not(:last-child)::after { content: "·"; display: inline-block; margin-left: var(--space-2); color: var(--text-3); text-decoration: none; }
#teamConciergeView .tc-zeile-nachrang { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-warnung) 28%, transparent); }
/* Auto queue (26.10.2026): placed without drawing – orange card while waiting, pill next to the waiting time. */
#teamConciergeView .tc-zeile-auto:not(.tc-zeile-dran) { background: color-mix(in srgb, var(--tc-warnung) 7%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-warnung) 34%, transparent); }
#teamConciergeView .tc-marke-auto { background: color-mix(in srgb, var(--tc-warnung) 16%, transparent); color: var(--tc-warnung); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-zeile-name .tc-marke-auto { margin-left: auto; }
#teamConciergeView .tc-zeile-name .tc-marke-auto + * { margin-left: 0; }
#teamConciergeView .tc-zeile-offen .tc-aktion-feld { margin-left: calc(32px + var(--space-3)); }
/* Tiles: the name opens the room; the whole tile does too (teamConcierge.js raumKarte). */
#teamConciergeView .tc-raum-oeffnen { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; transition: text-decoration-color var(--t-fast, .12s); }
#teamConciergeView .tc-raum-klickbar:hover .tc-raum-oeffnen, #teamConciergeView .tc-raum-oeffnen:hover { text-decoration-color: currentColor; }
#teamConciergeView .tc-raum-oeffnen:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm); }
#teamConciergeView .tc-raum-liste .tc-karte-titel { font-size: var(--fs-20); }
#teamConciergeView .tc-raum-liste .tc-belegt-zeile { padding: var(--space-2); border-radius: var(--radius-md); background: var(--tc-fuellung); }
#teamConciergeView .tc-raum-liste .tc-raum-leer { margin: auto 0; text-align: center; }
#teamConciergeView .tc-raum-mein { box-shadow: var(--tc-kante), inset 0 0 0 1px color-mix(in srgb, var(--tc-positiv) 35%, transparent); }
#teamConciergeView .tc-raum-allein { --tc-a: var(--tc-warnung); }
#teamConciergeView .tc-beitreten-knoepfe .tc-verlassen-knopf:disabled { opacity: .35; }
/* A guest alone in a room: two buttons (or the inline question) under the name. */
#teamConciergeView .tc-allein-feld { flex: 1 1 100%; display: flex; flex-direction: column; gap: var(--space-2); }
#teamConciergeView .tc-allein-feld > .tc-klein { color: var(--tc-warnung); }
#teamConciergeView .tc-allein-feld .tc-aktion-knoepfe { justify-content: flex-start; }
#teamConciergeView .tc-aktion-feld.tc-allein-feld { margin-left: 0; }
/* A room's own view: room name left, Betreuer right; guest card next to „Als Nächstes“. */
#teamConciergeView .tc-raum-kopf-gross { align-items: flex-start; gap: var(--space-4); }
#teamConciergeView .tc-zurueck-knopf { align-self: flex-start; margin: 0 0 var(--space-2) calc(-1 * var(--space-3)); }
#teamConciergeView .tc-betreuer { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2); min-width: 0; margin-left: auto; }
#teamConciergeView .tc-betreuer-label { font-size: var(--fs-11); font-weight: var(--fw-semibold); color: var(--text-3); text-transform: uppercase; letter-spacing: .05em; }
#teamConciergeView .tc-betreuer-liste { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
#teamConciergeView .tc-betreuer-liste li { display: inline-flex; align-items: center; gap: var(--space-2); padding: 3px var(--space-3) 3px 3px; border-radius: var(--radius-pill); background: color-mix(in srgb, var(--tc-positiv) 11%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-positiv) 28%, transparent); font-size: var(--fs-13); font-weight: var(--fw-medium); }
#teamConciergeView .tc-betreuer-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 14rem; }
#teamConciergeView .tc-mein-raster { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); align-items: start; }
@media (min-width: 900px) {
  /* The guest card narrower than „Als Nächstes“ (user: „aber schmaler“; end skeptic K7). */
  #teamConciergeView .tc-mein-raster { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
}
#teamConciergeView .tc-mein-oben { min-width: 0; }
#teamConciergeView .tc-timer-gruppe { display: inline-flex; align-items: center; gap: var(--space-2); flex: none; }
#teamConciergeView .tc-gast-knoepfe { display: flex; flex-wrap: wrap; gap: var(--space-2); }
#teamConciergeView .tc-gast-pause .tc-timer { color: var(--text-3); }
#teamConciergeView .tc-pause-an { background: color-mix(in srgb, var(--tc-warnung) 16%, transparent); color: var(--tc-warnung); box-shadow: none; }
#teamConciergeView .tc-marke-pause { gap: 4px; background: color-mix(in srgb, var(--tc-warnung) 14%, transparent); color: var(--tc-warnung); }
#teamConciergeView .tc-marke-pause .tc-sym { width: 12px; height: 12px; }
#teamConciergeView .tc-ziel-wahl button { white-space: nowrap; }
#teamConciergeView .tc-verlassen-frage { margin-left: 0; }
/* Einstellungen: target channels and daily budget. */
#teamConciergeView .tc-feld.tc-ziele { gap: var(--space-3); }
/* Statistik: one table, wider than a phone inside its own scroll box; the name column stays put. */
#teamConciergeView .tc-statistik-werkzeug { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); }
#teamConciergeView .tc-statistik-suche { max-width: 22rem; }
#teamConciergeView .tc-statistik-inhalt { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
#teamConciergeView .tc-statistik-huelle { overflow-x: auto; border-radius: var(--radius-md); box-shadow: inset 0 0 0 1px var(--tc-rand); }
#teamConciergeView .tc-statistik-huelle:focus-visible { outline: none; box-shadow: var(--focus-ring); }
#teamConciergeView .tc-statistik { width: 100%; border-collapse: collapse; font-size: var(--fs-13); }
#teamConciergeView .tc-statistik th, #teamConciergeView .tc-statistik td { padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--tc-rand); white-space: nowrap; }
#teamConciergeView .tc-statistik tbody tr:last-child > * { border-bottom: 0; }
#teamConciergeView .tc-statistik thead th { background: var(--tc-fuellung-stark); font-size: var(--fs-12); font-weight: var(--fw-medium); color: var(--text-2); }
#teamConciergeView .tc-statistik .tc-st-name { text-align: left; font-weight: var(--fw-regular); }
/* Narrow: the table scrolls sideways, the name column stays put (on a solid background, so numbers never show through). */
@media (max-width: 900px) {
  #teamConciergeView .tc-statistik .tc-st-name { position: sticky; left: 0; z-index: 1; background: var(--w3-flaeche, var(--surface-1)); }
  #teamConciergeView .tc-statistik thead .tc-st-name { z-index: 2; }
}
#teamConciergeView .tc-statistik .tc-st-zahl { text-align: right; }
#teamConciergeView .tc-statistik tbody tr:hover > * { background: var(--tc-fuellung); }
#teamConciergeView .tc-st-sort { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
#teamConciergeView .tc-st-sort:hover { color: var(--text-1); }
#teamConciergeView .tc-st-sort:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm); }
#teamConciergeView [aria-sort="ascending"] .tc-st-sort, #teamConciergeView [aria-sort="descending"] .tc-st-sort { color: var(--text-1); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-st-pfeil { width: 13px; height: 13px; }
#teamConciergeView .tc-st-pfeil.tc-st-auf { transform: rotate(180deg); }
@media (max-width: 640px) {
  #teamConciergeView .tc-zeile-knoepfe .tc-knopf { height: auto; min-height: 30px; padding-block: 4px; white-space: normal; text-align: center; }
  #teamConciergeView .tc-zeile-offen .tc-aktion-feld { margin-left: 0; }
  #teamConciergeView .tc-raum-kopf-gross { flex-direction: column; }
  #teamConciergeView .tc-betreuer { align-items: flex-start; margin-left: 0; }
  #teamConciergeView .tc-betreuer-liste { justify-content: flex-start; }
  #teamConciergeView .tc-gast-knoepfe { display: grid; grid-template-columns: minmax(0, 1fr); }
  #teamConciergeView .tc-ziel-wahl { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; border-radius: var(--radius-md); }
  #teamConciergeView .tc-statistik-suche { max-width: none; }
}
/* A guest alone: the two buttons take a line of their own under the name, on phones too (no row next to the name). */
#teamConciergeView .tc-raum .tc-belegt-zeile.tc-belegt-allein { flex-direction: row; flex-wrap: wrap; align-items: center; }
#teamConciergeView .tc-belegt-allein > .tc-allein-feld { flex: 1 1 100%; width: 100%; min-width: 0; }
#teamConciergeView .tc-allein-feld .tc-klein { overflow-wrap: anywhere; }
/* Dialogs inside the guest card or „Als Nächstes“ use the full card width (the queue's indent belongs to the place circle). */
#teamConciergeView .tc-gast .tc-aktion-feld, #teamConciergeView .tc-naechster .tc-aktion-feld { margin-left: 0; }
/* 1101–1400 px: the queue column is narrow; the button column gives way so name and concern keep their room. */
@media (min-width: 1101px) and (max-width: 1400px) {
  #teamConciergeView .tc-zeile-knoepfe { width: 9.5rem; }
  #teamConciergeView .tc-zeile-knoepfe .tc-knopf { height: auto; min-height: 30px; padding-block: 4px; white-space: normal; text-align: left; }
}
#teamConciergeView .tc-gast-unterwegs { background: color-mix(in srgb, var(--tc-warnung) 6%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-warnung) 28%, transparent); }
/* Narrow tiles (3 in a row at 1366 px): „<Name> kurz weg – noch N min“ wraps as one line of text, not as two columns. */
#teamConciergeView .tc-raum-weg { flex-wrap: wrap; column-gap: 4px; }

/* ── The Wartezimmer as one large tile on the left (26.10.2026, user): queue and voice channel inside, built like a
   room tile; the Stammtisch tiles share the rest. ── */
#teamConciergeView .tc-wz-gross { gap: var(--space-5); padding: var(--space-5); }
#teamConciergeView .tc-wz-gross > .tc-raum-kopf .tc-karte-titel { font-size: var(--fs-20); }
#teamConciergeView .tc-wz-abschnitt { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
#teamConciergeView .tc-wz-abschnitt + .tc-wz-abschnitt { padding-top: var(--space-4); border-top: 1px solid var(--tc-rand); }
#teamConciergeView .tc-wz-abschnitt > .tc-karte-kopf .tc-karte-titel { font-size: var(--fs-13); font-weight: var(--fw-semibold); color: var(--text-2); }
#teamConciergeView .tc-wz-gross .tc-leer { padding: var(--space-6) var(--space-4); }
/* „Frage ans Team“ (Wega mockup G): badge, quote, answer field, „Ohne Antwort schließen“ / „Antworten“. */
#teamConciergeView .tc-fragen { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
#teamConciergeView .tc-frage { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; padding: var(--space-3); border-radius: var(--radius-md); background: color-mix(in srgb, var(--tc-warnung) 7%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc-warnung) 30%, transparent); }
#teamConciergeView .tc-frage-erledigt { background: var(--tc-fuellung); box-shadow: inset 0 0 0 1px var(--tc-rand); }
#teamConciergeView .tc-frage-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
#teamConciergeView .tc-marke-frage { background: color-mix(in srgb, var(--tc-warnung) 18%, transparent); color: var(--tc-warnung); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-frage-zitat { margin: 0; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); background: var(--tc-fuellung); font-size: var(--fs-14); line-height: var(--lh-normal, 1.45); overflow-wrap: anywhere; }
#teamConciergeView .tc-frage-antwort { overflow-wrap: anywhere; color: var(--text-2); }
#teamConciergeView .tc-frage-feld { min-height: 56px; }
#teamConciergeView .tc-frage-fuss { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-3); }
#teamConciergeView .tc-frage-fuss > .tc-klein { flex: 1 1 14rem; min-width: 0; }
#teamConciergeView .tc-frage .tc-aktion-feld { margin-left: 0; }
/* „Fragen an dich“ (26.10.2026): at the top of my own Stammtisch, questions of people last with me; the last Betreuer as a
   badge on every question with a name (ellipsis instead of overflowing a narrow card). */
#teamConciergeView .tc-an-dich { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; padding-bottom: var(--space-4); border-bottom: 1px solid var(--tc-rand); }
#teamConciergeView .tc-an-dich .tc-fragen-scroll { max-height: 26rem; }
#teamConciergeView .tc-marke-betreuer { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

/* ── User feedback 26.10.2026 on the Wartezimmer mockup ── */
/* Queue in the tile: about three cards, the rest scrolls inside (phones: the page scrolls). */
#teamConciergeView .tc-schlange-drei { max-height: 33rem; overflow-y: auto; overscroll-behavior: contain; padding: 2px; margin: -2px; scrollbar-gutter: stable; }
#teamConciergeView .tc-schlange-drei:focus-visible, #teamConciergeView .tc-fragen-scroll:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-md); }
/* Questions card under the tile: fixed height, scrolls inside. */
#teamConciergeView .tc-fragen-scroll { max-height: 34rem; overflow-y: auto; overscroll-behavior: contain; padding: 2px; margin: -2px; scrollbar-gutter: stable; }
#teamConciergeView .tc-karte-fragen .tc-raum-leer { text-align: center; padding: var(--space-3) 0; }
#teamConciergeView .tc-frage-sprung { border: 0; cursor: pointer; font: inherit; font-size: var(--fs-11); font-weight: var(--fw-semibold); }
#teamConciergeView .tc-frage-sprung:hover { filter: brightness(1.12); }
#teamConciergeView .tc-frage-sprung:focus-visible { outline: none; box-shadow: var(--focus-ring); }
/* A narrow card (user: „die buttons rechts mit runterwandern damit das anliegen mehr platz hat“): the four buttons go
   under the content, side by side or 2 × 2; wide enough, they stay stacked on the right. */
#teamConciergeView .tc-schlange > .tc-zeile { container: tc-zeile / inline-size; }
@container tc-zeile (max-width: 620px) {
  #teamConciergeView .tc-zeile-haupt { grid-template-columns: auto minmax(0, 1fr); }
  #teamConciergeView .tc-zeile-knoepfe { grid-column: 1 / -1; grid-template-columns: repeat(auto-fit, minmax(min(9.5rem, 100%), 1fr)); width: auto; }
  #teamConciergeView .tc-zeile-knoepfe .tc-knopf { justify-content: center; white-space: normal; height: auto; min-height: 30px; padding-block: 4px; text-align: center; }
}
/* Phones (probe dep177, 390 px): in the 2 × 2 grid „In Stammtisch ziehen“ and „Concierge beenden“ broke onto two lines –
   below about 24rem of row width the four buttons stack, full width, one line each (labels unchanged). */
@container tc-zeile (max-width: 24rem) {
  #teamConciergeView .tc-zeile-knoepfe { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  #teamConciergeView .tc-schlange-drei, #teamConciergeView .tc-fragen-scroll { max-height: none; overflow: visible; }
}

/* ── Voice list under the queue (26.10.2026, user: the three voice channels C-Wartezimmer, Mentoring-, PP-Stammtisch, the
   people in each, Ticket with the time drawn or „kein Ticket“, since when in that channel; „In Stammtisch ziehen“ for
   guests without a ticket). Columns via subgrid, so Ticket and seit line up across rows; narrow (phones, a narrow tile):
   Ticket and seit go under the name, the column heads hide, the button takes its own line. ── */
/* The three channels side by side (26.10.2026, user: „3 spalten nebeneinander nicht übereinander um den platz besser zu
   nutzen“): as many columns as fit at 14rem each, one on phones; each column narrows its rows on its own (tc-vk). */
#teamConciergeView .tc-vk-liste-alle { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); align-items: start; gap: var(--space-4) var(--space-5); min-width: 0; }
#teamConciergeView .tc-vk { container: tc-vk / inline-size; display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
#teamConciergeView .tc-vk-kopf { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); min-width: 0; }
#teamConciergeView .tc-vk-name { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-13); font-weight: var(--fw-semibold); color: var(--text-1); }
#teamConciergeView .tc-vk-liste { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; column-gap: var(--space-3); row-gap: var(--space-1); margin: 0; padding: 0; list-style: none; min-width: 0; }
#teamConciergeView .tc-vk-liste > li { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; align-items: center; min-width: 0; }
#teamConciergeView .tc-vk-zeile { padding: var(--space-1) var(--space-2); border-radius: var(--radius-md); background: var(--tc-fuellung); }
#teamConciergeView .tc-vk-spalten { padding: 0 var(--space-2); font-size: var(--fs-11); color: var(--text-3); }
#teamConciergeView .tc-vk-wer { min-width: 0; }
#teamConciergeView .tc-vk-wer .tc-person { max-width: 100%; }
#teamConciergeView .tc-vk-ticket, #teamConciergeView .tc-vk-aktion { display: inline-flex; align-items: center; min-width: 0; }
#teamConciergeView .tc-vk-aktion:empty { display: none; }
#teamConciergeView .tc-vk-feld { grid-column: 1 / -1; margin: var(--space-2) 0 var(--space-1); }
#teamConciergeView .tc-vk-scroll { max-height: 22rem; overflow-y: auto; overscroll-behavior: contain; padding: 2px; margin: -2px; scrollbar-gutter: stable; }
#teamConciergeView .tc-vk-scroll > .tc-vk-spalten { position: sticky; top: 0; z-index: 1; background: var(--tc-karte); }
#teamConciergeView .tc-vk-scroll:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-md); }
@container tc-vk (max-width: 30rem) {
  #teamConciergeView .tc-vk-liste { display: flex; flex-direction: column; }
  #teamConciergeView .tc-vk-liste > .tc-vk-spalten { display: none; }
  #teamConciergeView .tc-vk-liste > .tc-vk-zeile { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "wer wer" "ticket seit" "aktion aktion"; row-gap: 2px; }
  #teamConciergeView .tc-vk-wer { grid-area: wer; }
  #teamConciergeView .tc-vk-ticket { grid-area: ticket; padding-left: calc(28px + var(--space-3)); }
  #teamConciergeView .tc-vk-seit { grid-area: seit; }
  #teamConciergeView .tc-vk-aktion { grid-area: aktion; padding-left: calc(28px + var(--space-3)); padding-top: 2px; }
  #teamConciergeView .tc-vk-feld { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  #teamConciergeView .tc-vk-scroll { max-height: none; overflow: visible; }
}

/* „Zuletzt bei dir“ (26.10.2026, Betreuer feedback): guests who left my Stammtisch keep a card with their profile until
   „Schließen“ – stacked under the guest cards, or as a card of its own while I sit in no Stammtisch. */
#teamConciergeView .tc-zuletzt { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
#teamConciergeView .tc-zuletzt-titel { margin: var(--space-1) 0 0; font-size: var(--fs-12); font-weight: var(--fw-semibold); color: var(--text-3); text-transform: uppercase; letter-spacing: .04em; }
#teamConciergeView .tc-zuletzt-liste { display: flex; flex-direction: column; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
#teamConciergeView .tc-zuletzt-eintrag { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--tc-fuellung); box-shadow: inset 0 0 0 1px var(--tc-rand); }
#teamConciergeView .tc-zuletzt-eintrag.tc-gast-gezeigt { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--tc-akzent) 55%, transparent); }
#teamConciergeView .tc-zuletzt-kopf { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-1) var(--space-3); min-width: 0; }
#teamConciergeView .tc-zuletzt-kopf .tc-person { min-width: 0; max-width: 100%; }
#teamConciergeView .tc-zuletzt-stand { color: var(--text-2); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#teamConciergeView .tc-zuletzt-knoepfe { display: inline-flex; flex-wrap: wrap; gap: var(--space-2); margin-left: auto; }
#teamConciergeView .tc-zuletzt-knoepfe .tc-knopf[aria-pressed="true"] { background: var(--tc-fuellung-stark); color: var(--text-1); }
#teamConciergeView .tc-zuletzt-rest { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; padding-top: var(--space-2); border-top: 1px solid var(--tc-rand); }
#teamConciergeView .tc-zuletzt-rest-teil { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
#teamConciergeView .tc-zuletzt-rest .tc-aktion-knoepfe { justify-content: flex-start; flex-wrap: wrap; }
#teamConciergeView .tc-zuletzt-karte { gap: var(--space-4); }
@media (max-width: 640px) {
  #teamConciergeView .tc-zuletzt-eintrag { padding: var(--space-3); }
  #teamConciergeView .tc-zuletzt-knoepfe { margin-left: 0; width: 100%; }
  #teamConciergeView .tc-zuletzt-knoepfe .tc-knopf { flex: 1 1 auto; justify-content: center; }
}
/* Note tile without the tab User (26.10.2026, teamConcierge.js notizKachel): field, button and the Betreuer's own notes
   about the guest, in place of the profile. */
#teamConciergeView .tc-notiz-kachel { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; max-width: 48rem; }
#teamConciergeView .tc-notiz-kopf { display: flex; align-items: center; gap: var(--space-2); }
#teamConciergeView .tc-notiz-kopf .tc-sym { width: 18px; height: 18px; flex: none; color: var(--text-2); }
#teamConciergeView .tc-notiz-titel { margin: 0; font-size: var(--fs-14); font-weight: var(--fw-semibold); color: var(--text-1); }
#teamConciergeView .tc-notiz-kachel > .tc-aktion-knoepfe { justify-content: flex-start; }
#teamConciergeView .tc-gast-notizen { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); max-height: 22rem; overflow-y: auto; }
#teamConciergeView .tc-gast-notiz { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; padding: var(--space-2) 0; border-top: 1px solid var(--tc-rand); }
#teamConciergeView .tc-gast-notiz-text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text-1); }
#teamConciergeView .tc-gast-notiz-fuss { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2); }
#teamConciergeView .tc-gast-notiz .tc-aktion-knoepfe { justify-content: flex-start; flex-wrap: wrap; }

/* Concierge note of a session (26.10.2026 evening): on the guest card in „Dein Stammtisch“ and in „Zuletzt bei dir“ –
   label, field, one hint line, „Concierge-Notiz speichern“, then the notes saved here for this session. */
#teamConciergeView .tc-cnotiz { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; max-width: 48rem; padding-top: var(--space-2); border-top: 1px solid var(--tc-rand); }
#teamConciergeView .tc-cnotiz > .tc-aktion-knoepfe { justify-content: flex-start; }
#teamConciergeView .tc-cnotiz > .tc-klein { margin: 0; }
#teamConciergeView .tc-cnotiz-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-1); }
#teamConciergeView .tc-cnotiz-eintrag { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); min-width: 0; padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); background: var(--tc-fuellung); }
#teamConciergeView .tc-cnotiz-text { min-width: 0; white-space: pre-line; overflow-wrap: anywhere; color: var(--text-1); }
#teamConciergeView .tc-cnotiz-eintrag .tc-mono { flex: none; }
/* Pencil and × at a saved Concierge note (26.10.2026 evening): text, time and buttons wrap; the edit row stacks. */
#teamConciergeView .tc-cnotiz-eintrag { flex-wrap: wrap; }
#teamConciergeView .tc-cnotiz-eintrag .tc-cnotiz-text { flex: 1 1 12rem; }
#teamConciergeView .tc-cnotiz-eintrag > .tc-aktion-knoepfe { flex: none; }
#teamConciergeView .tc-cnotiz-edit { flex-direction: column; align-items: stretch; }
#teamConciergeView .tc-cnotiz-bearbeitet { flex-basis: 100%; }
/* The delete question takes its own full-width line inside the row; its buttons wrap (probe dep182: 20 px overhang at 390). */
#teamConciergeView .tc-cnotiz-eintrag > .tc-cnotiz-frage { flex: 1 1 100%; min-width: 0; justify-content: flex-start; align-items: center; }
#teamConciergeView .tc-notizen .tc-cnotiz-bearbeitet { display: block; }