/*
  Charte de l'espace accompagnateur (Staff V2, lot L2, maquette validée le 21/10 : option C).
  Portée : UNIQUEMENT sous .staff-space (coquille d'une session accompagnateur, MainLayout). L'expérience voyageur n'est pas
  touchée : aucune règle de ce fichier ne s'applique hors de .staff-space. Les jetons --mc-* sont redéfinis à l'intérieur de
  l'espace pour que les composants communs (boutons, cartes, bandeaux) prennent la charte Staff sans être dupliqués.
  Lisibilité terrain : texte courant 16 px au moins, cibles tactiles de 52 px, contraste AA, une action principale par écran.
*/
.staff-space {
    --st-navy: #071439;
    --st-navy-2: #13235A;
    --st-navy-3: #24346E;
    --st-ink: #0F1B3D;
    --st-ink-2: #4A5672;
    --st-ink-3: #6B7690;
    --st-red: #D72C40;
    --st-red-soft: #FDECEE;
    --st-red-ink: #B4182C;
    --st-bg: #F5F6FA;
    --st-card: #FFFFFF;
    --st-line: #E4E7EE;
    --st-line-2: #EEF0F5;
    --st-ok: #17865C;
    --st-ok-soft: #E5F5EE;
    --st-warn: #A6620A;
    --st-warn-soft: #FDF2E2;
    --st-info-soft: #EAF0FB;
    --st-r-s: 12px;
    --st-r-m: 18px;
    --st-r-l: 24px;
    --st-touch: 52px;
    --st-shadow: 0 10px 30px rgba(7, 20, 57, 0.10);
    --st-shadow-s: 0 2px 10px rgba(7, 20, 57, 0.06);
    --st-ease: cubic-bezier(.2, .7, .2, 1);

    --mc-primary: var(--st-navy);
    --mc-primary-alt: var(--st-navy-2);
    --mc-accent: var(--st-red);
    --mc-accent-dark: var(--st-red-ink);
    --mc-accent-soft: var(--st-red-soft);
    --mc-surface: var(--st-bg);
    --mc-background: var(--st-bg);
    --mc-border: var(--st-line);
    --mc-text: var(--st-ink);
    --mc-text-secondary: var(--st-ink-2);
    --mc-success: var(--st-ok);
    --mc-success-soft: var(--st-ok-soft);
    --mc-warning: var(--st-warn);
    --mc-warning-soft: var(--st-warn-soft);
    --mc-danger: var(--st-red-ink);
    --mc-danger-soft: var(--st-red-soft);
    --mc-radius-button: var(--st-r-s);
    --mc-radius-card: var(--st-r-m);
    --mc-radius-hero: var(--st-r-l);
    --mc-touch: 48px;
    --mc-touch-lg: var(--st-touch);
    --mc-tabbar-h: 66px;

    background: var(--st-bg);
    color: var(--st-ink);
    padding-bottom: calc(var(--mc-tabbar-h) + var(--safe-bottom) + 24px);
}

/* ─── En-tête ─────────────────────────────────────────────────────────────────────────────────── */
.staff-space .topbar { background: rgba(245, 246, 250, 0.94); backdrop-filter: blur(10px); border-bottom: 1px solid transparent; min-height: calc(60px + var(--safe-top)); padding-left: 12px; padding-right: 12px; }
.staff-space .topbar .title { text-transform: none; font-size: 18px; font-weight: 800; text-align: center; padding: 0; color: var(--st-ink); }
.staff-space .topbar .title::after { content: none; }
.staff-space .topbar .back { width: 44px; height: 44px; background: var(--st-card); border: 1px solid var(--st-line); flex: none; }
.staff-space .topbar:not(:has(.back))::before { content: ""; width: 44px; flex: none; }
.staff-space .staff-refresh { width: 44px; height: 44px; background: var(--st-card); border: 1px solid var(--st-line); margin-left: 0; }

/* ─── Contenu, titres, boutons ────────────────────────────────────────────────────────────────── */
.staff-space .content.staff { padding: 12px 16px 8px; gap: 16px; }
.staff-space .section-title { text-transform: uppercase; font-size: 13px; letter-spacing: 0.08em; font-weight: 800; color: var(--st-ink-2); margin: 4px 0 0; }
.staff-space .section-title::after { content: none; }
.staff-space .muted { color: var(--st-ink-2); font-size: 15px; }
.staff-space .card { border: 1px solid var(--st-line); border-radius: var(--st-r-m); box-shadow: var(--st-shadow-s); padding: 16px; }
.staff-space .btn { text-transform: none; font-size: 16px; font-weight: 800; letter-spacing: 0; min-height: var(--st-touch); border-radius: var(--st-r-s); transition: transform .12s var(--st-ease), background-color .2s ease, box-shadow .2s ease; }
.staff-space .btn:active { transform: scale(0.98); }
.staff-space .btn.ghost { border-color: var(--st-line); background: var(--st-card); color: var(--st-ink); }
.staff-space .btn.navy { background: var(--st-navy); border-color: var(--st-navy); }
.staff-space .btn[disabled] { opacity: 1; background: var(--st-line-2); border-color: var(--st-line-2); color: var(--st-ink-3); cursor: not-allowed; transform: none; }
.staff-space .banner { border-radius: var(--st-r-s); font-size: 15px; }
.staff-space .empty { background: var(--st-card); border: 1px dashed var(--st-line); border-radius: var(--st-r-m); padding: 28px 20px; gap: 10px; color: var(--st-ink-2); }
.staff-space .empty strong { color: var(--st-ink); font-size: 17px; }
.staff-space .staff-synced { text-align: left; font-size: 13px; color: var(--st-ink-3); }
.staff-space .skeleton { border-radius: var(--st-r-m); }
.staff-space .staff-badge { background: var(--st-warn-soft); color: var(--st-warn); font-size: 13px; padding: 5px 10px; }
.st-dot::after { content: "."; color: var(--st-red); }

/* ─── Barre d'onglets : Aujourd'hui / Planning / Moi ──────────────────────────────────────────── */
.staff-space .tabbar { background: rgba(255, 255, 255, 0.97); backdrop-filter: blur(10px); box-shadow: 0 -1px 0 var(--st-line); }
.staff-space .tabbar a { font-size: 13px; color: var(--st-ink-3); gap: 4px; min-height: var(--mc-tabbar-h); transition: color .2s ease; }
.staff-space .tabbar a .ds-icon { width: 24px; height: 24px; }
.staff-space .tabbar a.active { color: var(--st-red); }
.staff-space .tabbar a.active::before { left: 38%; right: 38%; background: var(--st-red); }
/* Clavier ouvert : voir « kb-open » en fin de fichier (clavier MESURÉ par js/keyboard.js). L'ancienne règle « champ actif »
   (:focus) est retirée (recette S24+ du 06/11) : clavier fermé par la touche retour, le champ garde le focus et la barre
   d'onglets comme les confirmations (« Arrivée enregistrée — Annuler ») restaient masquées. */

/* ─── Accueil : salutation et mission active ──────────────────────────────────────────────────── */
.st-greet { display: flex; flex-direction: column; gap: 4px; padding: 4px 2px 0; }
.st-greet .st-date { font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--st-ink-2); }
.st-greet h1 { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; color: var(--st-ink); line-height: 1.1; overflow-wrap: anywhere; }
.st-greet p { font-size: 16px; color: var(--st-ink-2); }

.staff-space .staff-next { background: linear-gradient(160deg, var(--st-navy-2) 0%, var(--st-navy) 70%); border-radius: var(--st-r-l); padding: 20px; gap: 12px; box-shadow: var(--st-shadow); position: relative; overflow: hidden; }
.staff-space .staff-next::after { content: ""; position: absolute; right: -60px; top: -60px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(circle, rgba(215, 44, 64, 0.20) 0%, rgba(215, 44, 64, 0) 70%); pointer-events: none; }
.staff-space .staff-next > * { position: relative; z-index: 1; }
.staff-space .staff-eyebrow { font-size: 13px; letter-spacing: 0.06em; }
.staff-space .staff-eyebrow::after { content: none; }
.staff-space .staff-status { font-size: 13px; padding: 5px 12px; background: rgba(255, 255, 255, 0.12); border: 0; }
.staff-space .staff-status.live { background: var(--st-red); }
.staff-space .staff-status.live::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #fff; margin-right: 6px; vertical-align: 1px; animation: st-pulse 1.6s ease-in-out infinite; }
@keyframes st-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.staff-space .staff-next-title { font-size: 26px; letter-spacing: -0.01em; }
.staff-space .staff-next-when { align-items: baseline; gap: 4px 10px; }
.staff-space .staff-next-time { font-size: 30px; }
.staff-space .staff-next-day { font-size: 17px; opacity: .9; }
.staff-space .staff-countdown { background: rgba(255, 255, 255, 0.12); font-size: 14px; color: #fff; }
.staff-space .staff-next-type { font-size: 13px; letter-spacing: 0.06em; }
.staff-space .staff-facts { gap: 10px; }
.staff-space .staff-facts li { font-size: 16px; }
.staff-space .staff-facts small { opacity: .7; }
.staff-space .staff-next .staff-headcount { background: rgba(255, 255, 255, 0.07); border-left: 0; border-radius: var(--st-r-s); padding: 12px 14px; }
.staff-space .staff-next .staff-total { font-size: 17px; }
.staff-space .staff-next-instructions { background: rgba(255, 255, 255, 0.07); border-radius: var(--st-r-s); padding: 10px 12px; font-size: 15px; }
.staff-space .staff-next .btn.on-photo { background: rgba(255, 255, 255, 0.12); border-color: transparent; color: #fff; }
.staff-space .staff-next .btn.primary { background: #fff; border-color: #fff; color: var(--st-navy); }
.staff-space .staff-next .btn.primary.st-cta { background: var(--st-red); border-color: var(--st-red); color: #fff; }
.staff-space .staff-actions { gap: 10px; margin-top: 4px; }
.staff-space .staff-actions.single { grid-template-columns: 1fr; }
.staff-space .staff-no-address { border-radius: var(--st-r-s); border-color: rgba(255, 255, 255, 0.35); }
.st-link-light { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 800; font-size: 15px; color: #fff; text-decoration: underline; text-underline-offset: 4px; background: none; border: 0; padding: 0; cursor: pointer; align-self: flex-start; }
.st-link-light .ds-icon { width: 18px; height: 18px; }
.staff-space .staff-next-pax { min-height: 44px; font-size: 15px; }

/* Carte compacte (recette S24+ du 21/10) : l'action principale reste visible au premier écran */
.staff-space .staff-next { gap: 10px; padding: 18px 18px 16px; }
.st-chip-light { display: inline-flex; align-items: center; min-height: 28px; padding: 3px 12px; border-radius: 999px; background: rgba(255, 255, 255, 0.12); color: #fff; font-size: 13px; font-weight: 800; letter-spacing: 0.02em; }
.staff-space .staff-next-title { font-size: 24px; line-height: 1.15; }
.staff-space .staff-next-day { font-size: 15px; opacity: .8; }
.staff-space .staff-next-time { font-size: 28px; }
.staff-space .staff-countdown.inline { background: none; padding: 0; font-size: 15px; font-weight: 700; opacity: .9; align-self: auto; }
.st-hero-place { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 600; min-height: 44px; }
.st-hero-place > .ds-icon { flex: none; width: 20px; height: 20px; opacity: .8; }
.st-hero-place > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.st-icon-light { flex: none; width: 44px; height: 44px; border-radius: 12px; border: 0; background: rgba(255, 255, 255, 0.12); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.st-icon-light .ds-icon { width: 20px; height: 20px; }
.st-hero-line { font-size: 15px; opacity: .85; overflow-wrap: anywhere; }
.staff-space .staff-next-instructions span { -webkit-line-clamp: 1; }
.staff-space .staff-next .staff-no-address { min-height: 40px; }
.staff-space .staff-card-time { width: 70px; }
.staff-space .staff-card-time small { white-space: nowrap; }

/* Indicateurs de présence de la mission active (calculés par le serveur, jamais sur le téléphone) */
.st-presence { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.st-presence > div { background: rgba(255, 255, 255, 0.08); border-radius: var(--st-r-s); padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.st-presence strong { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.1; }
.st-presence span { font-size: 13px; opacity: .8; }
.st-presence .ok strong { color: #7EE2B5; }
.st-presence .warn strong { color: #FFD08A; }
.st-presence .ko strong { color: #FF9AA6; }

/* ─── Listes de missions (accueil, planning) ──────────────────────────────────────────────────── */
.st-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 4px; }
.st-section-head h2 { font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--st-ink-2); }
.st-section-head a { font-size: 15px; font-weight: 800; color: var(--st-ink); min-height: 44px; display: inline-flex; align-items: center; gap: 2px; }
.staff-space .staff-section { gap: 10px; }
.staff-space .staff-card { border: 1px solid var(--st-line); border-left: 1px solid var(--st-line); border-radius: var(--st-r-m); background: var(--st-card); box-shadow: var(--st-shadow-s); padding: 14px; gap: 14px; transition: transform .12s var(--st-ease); }
.staff-space .staff-card:active { transform: scale(0.99); }
.staff-space .staff-card.past { opacity: .6; box-shadow: none; }
.staff-space .staff-card-time { width: 62px; padding-right: 12px; border-right: 1px solid var(--st-line-2); }
.staff-space .staff-card-time strong { font-size: 22px; color: var(--st-ink); }
.staff-space .staff-card-time small { font-size: 13px; color: var(--st-ink-3); }
.staff-space .staff-card-type { font-size: 13px; color: var(--st-ink-3); }
.staff-space .staff-card-title { font-size: 17px; color: var(--st-ink); }
.staff-space .staff-card-line { font-size: 15px; color: var(--st-ink-2); }
.staff-space .staff-card-pax { font-size: 15px; color: var(--st-ink); }
.staff-space .staff-planning-day { background: var(--st-bg); color: var(--st-ink-2); font-size: 13px; letter-spacing: 0.08em; padding-top: 10px; padding-bottom: 10px; top: calc(60px + var(--safe-top)); }
.staff-space .staff-groups { background: var(--st-card); border: 1px solid var(--st-line); border-radius: var(--st-r-m); padding: 0 14px; }
.staff-space .staff-groups summary { font-size: 13px; letter-spacing: 0.06em; color: var(--st-ink-2); }

/* ─── Mission : en-tête, segments, blocs ──────────────────────────────────────────────────────── */
.st-mhead { display: flex; flex-direction: column; gap: 8px; padding: 2px 2px 0; }
.st-kicker { font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--st-ink-2); }
.st-mhead h1 { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.12; color: var(--st-ink); overflow-wrap: anywhere; }
.st-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.st-tag { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; border-radius: 999px; padding: 4px 12px; font-size: 14px; font-weight: 800; background: var(--st-line-2); color: var(--st-ink-2); }
.st-tag.ok { background: var(--st-ok-soft); color: var(--st-ok); }
.st-tag.warn { background: var(--st-warn-soft); color: var(--st-warn); }
.st-tag.red { background: var(--st-red-soft); color: var(--st-red-ink); }
.st-tag.live { background: var(--st-red); color: #fff; }

.st-seg { position: sticky; top: calc(60px + var(--safe-top)); z-index: 15; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; padding: 4px; border-radius: var(--st-r-s); background: var(--st-line-2); box-shadow: 0 0 0 6px var(--st-bg); }
.st-seg a { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border-radius: 9px; font-size: 15px; font-weight: 800; color: var(--st-ink-2); transition: background-color .2s ease, color .2s ease, box-shadow .2s ease; }
.st-seg a.on { background: var(--st-card); color: var(--st-ink); box-shadow: var(--st-shadow-s); }
.st-seg .st-count { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--st-red-soft); color: var(--st-red-ink); font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
/* Quatre rubriques (mission qui distribue des cadeaux : Mission / Accueil / Pointage / Cadeaux) : libellés serrés, rien de coupé à 360 px. */
.st-seg.four a { font-size: 14px; gap: 4px; padding: 0 2px; }
.st-seg.four .st-count { min-width: 20px; padding: 0 4px; font-size: 11px; }

/* ─── Accueil (chantier terrain du 05/11) : comptoir, debout, une main ─────────────────────────────────────────── */
.st-counters.acc { grid-template-columns: repeat(2, 1fr); }
.st-counters.acc .st-counter small { font-size: 13px; color: var(--st-ink-3); font-weight: 600; }
.st-pax.acc { flex-direction: column; align-items: stretch; gap: 10px; padding: 12px; }
.st-pax.acc.served { border-color: #BFE5D3; background: #FAFDFB; }
.st-acc-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.st-acc-btn { min-height: 52px; border-radius: 14px; border: 1.5px solid var(--st-navy); background: var(--st-card); color: var(--st-navy); font: inherit; font-size: 16px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 0 8px; cursor: pointer; transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .12s var(--st-ease); }
.st-acc-btn .ds-icon { width: 22px; height: 22px; }
.st-acc-btn:active { transform: scale(0.97); }
.st-acc-btn.gift { background: var(--st-red); border-color: var(--st-red); color: #fff; }
.st-acc-btn.on { background: var(--st-ok); border-color: var(--st-ok); color: #fff; }
.st-acc-btn[disabled] { cursor: not-allowed; opacity: .4; transform: none; }
.st-acc-flash { margin-top: 4px; font-size: 15px; font-weight: 800; color: var(--st-ok); }
.st-acc-flash.ko { color: var(--st-red-ink); }

.st-block { background: var(--st-card); border: 1px solid var(--st-line); border-radius: var(--st-r-m); box-shadow: var(--st-shadow-s); padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.st-block > h2 { font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--st-ink-2); }
.st-when { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: 8px; }
.st-when div { display: flex; flex-direction: column; gap: 2px; }
.st-when div:last-child { text-align: right; }
.st-when small { font-size: 14px; color: var(--st-ink-3); font-weight: 600; }
.st-when strong { font-size: 30px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--st-ink); line-height: 1.05; }
.st-when .arrow { color: var(--st-red); font-size: 22px; font-weight: 800; padding-bottom: 6px; }
.st-zone { font-size: 14px; color: var(--st-ink-3); }
.st-place { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border-radius: var(--st-r-s); background: var(--st-bg); }
.st-place .ico { flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--st-red-soft); color: var(--st-red); display: inline-flex; align-items: center; justify-content: center; }
.st-place strong { display: block; font-size: 16px; color: var(--st-ink); overflow-wrap: anywhere; }
.st-place span { display: block; font-size: 15px; color: var(--st-ink-2); overflow-wrap: anywhere; }
.st-progress { height: 8px; border-radius: 999px; background: var(--st-line-2); overflow: hidden; }
.st-progress > span { display: block; height: 100%; border-radius: 999px; background: var(--st-ok); transition: width .4s var(--st-ease); }
.st-row-between { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.st-big { font-size: 22px; font-weight: 800; color: var(--st-ink); }
.staff-space .staff-plain a { color: var(--st-ink); }
.staff-space .staff-team-row strong { font-size: 16px; }

/* ─── Pointage (L3) ───────────────────────────────────────────────────────────────────────────── */
.st-counters { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.st-counter { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px; min-height: 74px; border-radius: var(--st-r-m); background: var(--st-card); border: 1px solid var(--st-line); box-shadow: var(--st-shadow-s); text-align: left; cursor: pointer; font: inherit; color: inherit; transition: border-color .2s ease, box-shadow .2s ease, transform .12s var(--st-ease); }
.st-counter:active { transform: scale(0.98); }
.st-counter strong { font-size: 26px; font-weight: 800; line-height: 1.05; font-variant-numeric: tabular-nums; }
.st-counter span { font-size: 14px; color: var(--st-ink-2); font-weight: 700; }
.st-counter.ok strong { color: var(--st-ok); }
.st-counter.warn strong { color: var(--st-warn); }
.st-counter.ko strong { color: var(--st-red); }
.st-counter[aria-pressed="true"] { border-color: var(--st-ink); box-shadow: 0 0 0 1px var(--st-ink); }
.st-search { position: relative; }
.st-search .ds-icon { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; color: var(--st-ink-3); pointer-events: none; }
.st-search input { width: 100%; min-height: var(--st-touch); padding: 0 48px 0 46px; border-radius: var(--st-r-m); border: 1px solid var(--st-line); background: var(--st-card); font: inherit; font-size: 16px; color: var(--st-ink); -webkit-appearance: none; appearance: none; }
.st-search input:focus { outline: none; border-color: var(--st-ink); box-shadow: 0 0 0 3px rgba(15, 27, 61, 0.10); }
.st-search input::-webkit-search-cancel-button { display: none; }
.st-search .st-clear { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border: 0; background: none; color: var(--st-ink-3); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.st-search .st-clear .ds-icon { position: static; transform: none; }
.st-chips { display: flex; gap: 8px; overflow-x: auto; margin: 0 -16px; padding: 0 16px 2px; scrollbar-width: none; }
.st-chips::-webkit-scrollbar { display: none; }
.st-chip { flex: none; min-height: 40px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--st-line); background: var(--st-card); color: var(--st-ink); font: inherit; font-size: 15px; font-weight: 700; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; transition: background-color .2s ease, color .2s ease; }
.st-chip.on { background: var(--st-navy); border-color: var(--st-navy); color: #fff; }
.st-chip small { font-size: 13px; opacity: .75; font-weight: 700; }
.st-group-head { display: flex; justify-content: space-between; align-items: baseline; padding: 6px 4px 0; font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--st-ink-2); }
.st-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.st-pax { display: flex; align-items: center; gap: 10px; min-height: 72px; padding: 10px 10px 10px 14px; border-radius: var(--st-r-m); background: var(--st-card); border: 1px solid var(--st-line); transition: background-color .25s ease, border-color .25s ease; }
.st-pax.present { border-color: #BFE5D3; }
.st-pax.absent { background: #FFF7F8; border-color: #F4C3CA; }
.st-pax.mixed { border-color: #F2D3A6; }
.st-pax.busy { opacity: .7; }
/* Ligne changée par un collègue à la dernière relecture : signalée quelques secondes (premier appui ignoré, voir StaffPointage). */
.st-pax.fresh { box-shadow: 0 0 0 2px var(--st-warn); animation: st-fresh 1.2s ease-out 2; }
@keyframes st-fresh { 0% { background-color: var(--st-warn-soft); } 100% { background-color: var(--st-card); } }
.st-pax-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.st-pax-name { font-size: 17px; font-weight: 800; color: var(--st-ink); overflow-wrap: anywhere; line-height: 1.2; }
.st-pax-meta { font-size: 14px; color: var(--st-ink-2); overflow-wrap: anywhere; }
.st-pax-meta.ok { color: var(--st-ok); font-weight: 700; }
.st-pax-meta.ko { color: var(--st-red-ink); font-weight: 700; }
.st-pax-meta.warn { color: var(--st-warn); font-weight: 700; }
.st-pax-pills { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.st-pill { font-size: 12px; font-weight: 800; border-radius: 999px; padding: 3px 8px; background: var(--st-info-soft); color: var(--st-navy-2); }
.st-pill.warn { background: var(--st-warn-soft); color: var(--st-warn); }
.st-marks { flex: none; display: flex; gap: 10px; }
.st-mark { width: 52px; height: 52px; border-radius: 14px; border: 1.5px solid var(--st-line); background: var(--st-card); color: var(--st-ink-3); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .12s var(--st-ease); }
.st-mark .ds-icon { width: 26px; height: 26px; }
.st-mark:active { transform: scale(0.94); }
.st-mark.yes.on { background: var(--st-ok); border-color: var(--st-ok); color: #fff; }
.st-mark.no { border-style: dashed; color: var(--st-red-ink); }
.st-mark.no.on { background: var(--st-red); border-color: var(--st-red); border-style: solid; color: #fff; }
.st-mark[disabled] { cursor: not-allowed; opacity: .4; transform: none; }
.st-note { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--st-r-s); background: var(--st-info-soft); color: var(--st-navy-2); font-size: 15px; }
.st-note .ds-icon { flex: none; width: 20px; height: 20px; margin-top: 1px; }
.st-note.warn { background: var(--st-warn-soft); color: var(--st-warn); }
.st-note.ko { background: var(--st-red-soft); color: var(--st-red-ink); }
.st-note.offline { background: var(--st-navy); color: #fff; }
.st-note strong { display: block; }

/* Message flottant (« Annuler », conflit) au-dessus de la barre d'onglets, jamais sur le contenu cliquable */
.st-toast { position: fixed; left: 16px; right: 16px; bottom: calc(var(--mc-tabbar-h) + var(--safe-bottom) + 12px); z-index: 40; display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 8px 8px 16px; border-radius: var(--st-r-m); background: var(--st-navy); color: #fff; box-shadow: var(--st-shadow); font-size: 15px; font-weight: 600; animation: st-rise .22s var(--st-ease); }
.st-toast span { flex: 1; min-width: 0; }
.st-toast button { flex: none; min-height: 44px; padding: 0 14px; border-radius: 10px; border: 0; background: rgba(255, 255, 255, 0.14); color: #fff; font-weight: 800; font-size: 15px; cursor: pointer; }
.st-toast.ko { background: var(--st-red-ink); }
@keyframes st-rise { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }
.staff-space:has(.st-toast) .content.staff { padding-bottom: 80px; }

/* Barre « mission en cours » : seulement hors de l'accueil et de la mission concernée ; jamais sous le clavier */
.st-livebar { position: fixed; left: 12px; right: 12px; bottom: calc(var(--mc-tabbar-h) + var(--safe-bottom) + 10px); z-index: 35; display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 8px 8px 8px 16px; border-radius: var(--st-r-m); background: var(--st-navy); color: #fff; box-shadow: var(--st-shadow); animation: st-rise .25s var(--st-ease); }
.st-livebar .txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.st-livebar strong { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.st-livebar small { font-size: 13px; opacity: .8; }
.st-livebar a { flex: none; min-height: 44px; padding: 0 16px; border-radius: 12px; background: var(--st-red); color: #fff; font-weight: 800; font-size: 15px; display: inline-flex; align-items: center; }
.staff-space:has(.st-livebar) { padding-bottom: calc(var(--mc-tabbar-h) + var(--safe-bottom) + 84px); }

/* ─── Moi ─────────────────────────────────────────────────────────────────────────────────────── */
.staff-space .avatar { background: var(--st-navy); width: 48px; height: 48px; font-size: 17px; }
.staff-space .link-row { min-height: var(--st-touch); }

/* Transitions de page discrètes (aucune animation si l'utilisateur l'a demandé) */
.staff-space .content.staff { animation: st-fade .18s ease-out; }
@keyframes st-fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
    .staff-space *, .staff-space *::before, .staff-space *::after { animation: none !important; transition: none !important; }
}

/* ─── Cadeaux (L5) : avancement, cartes par voyageur, feuille de remise ───────────────────── */
.st-gift-hero { background: linear-gradient(160deg, var(--st-navy-2) 0%, var(--st-navy) 70%); color: #fff; border-radius: var(--st-r-l); padding: 20px; display: flex; flex-direction: column; gap: 12px; box-shadow: var(--st-shadow); }
.st-gift-hero-top { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.st-gift-hero-top strong { font-size: 44px; font-weight: 800; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.st-gift-hero-top span { font-size: 19px; font-weight: 700; opacity: .9; }
.st-gift-hero > span { font-size: 16px; opacity: .85; }
.st-gift-hero-empty { font-size: 17px; font-weight: 700; }
.st-gift-bar { height: 8px; border-radius: 999px; background: rgba(255, 255, 255, 0.16); overflow: hidden; }
.st-gift-bar > span { display: block; height: 100%; border-radius: 999px; background: #FF6B7A; transition: width .4s var(--st-ease); }
.st-gift-views { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 4px; border-radius: 14px; background: var(--st-line-2); }
.st-gift-views button { min-height: 56px; border: 0; border-radius: 10px; background: transparent; color: var(--st-ink-2); font-weight: 800; font-size: 14px; line-height: 1.15; padding: 6px 4px; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.st-gift-views button strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.st-gift-views button[aria-pressed="true"] { background: var(--st-card); color: var(--st-ink); box-shadow: var(--st-shadow-s); }
.st-gift { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: var(--st-r-m); background: var(--st-card); border: 1px solid var(--st-line); box-shadow: var(--st-shadow-s); }
.st-gift.done { border-color: #BFE5D3; }
.st-gift.busy { opacity: .7; }
.st-gift-head { display: flex; align-items: flex-start; gap: 12px; }
.st-give { flex: none; min-height: 48px; padding: 0 18px; border: 0; border-radius: 14px; background: var(--st-red); color: #fff; font-size: 16px; font-weight: 800; cursor: pointer; transition: transform .12s ease; }
.st-give:active { transform: scale(0.97); }
.st-give.small { min-height: 44px; padding: 0 14px; font-size: 15px; }
.st-give[disabled] { background: var(--st-line-2); color: var(--st-ink-3); cursor: not-allowed; transform: none; }
.st-gift-done { flex: none; display: inline-flex; align-items: center; gap: 4px; min-height: 44px; color: var(--st-ok); font-weight: 800; font-size: 15px; }
.st-gift-done .ds-icon { width: 18px; height: 18px; }
.st-gift-order { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 8px; border-top: 1px solid var(--st-line-2); font-size: 14px; font-weight: 800; color: var(--st-ink-2); }
.st-gift-order span { min-width: 0; overflow-wrap: anywhere; }
.st-gift-items { list-style: none; margin: 0; padding: 10px 14px; border-radius: var(--st-r-s); background: var(--st-bg); display: flex; flex-direction: column; gap: 8px; }
.st-gift-items li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 16px; color: var(--st-ink); }
.st-gift-items .lbl { min-width: 0; overflow-wrap: anywhere; }
.st-state { flex: none; font-size: 14px; color: var(--st-ink-2); white-space: nowrap; }
.st-state.ok { color: var(--st-ok); font-weight: 800; }
.st-state.part { color: var(--st-warn); font-weight: 800; }
.st-state.warn { color: var(--st-red-ink); font-weight: 800; white-space: normal; text-align: right; }
.st-gift-nothing { font-size: 15px; color: var(--st-ink-2); }
.st-gift-by { font-size: 14px; color: var(--st-ink-3); }
.st-gift-fix { align-self: flex-start; min-height: 44px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--st-line); background: var(--st-card); color: var(--st-ink); font-weight: 800; font-size: 15px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.st-gift-fix small { font-weight: 600; color: var(--st-ink-3); font-size: 13px; }

/* Feuille (remise, correction) : posée en bas, au-dessus de tout ; la barre d'onglets et la barre « en cours » s'effacent */
.st-sheet-veil { position: fixed; inset: 0; z-index: 70; background: rgba(7, 20, 57, 0.45); animation: st-fade .18s ease-out; }
.st-sheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 71; max-height: 88vh; overflow-y: auto; overscroll-behavior: contain; background: var(--st-card); border-radius: 24px 24px 0 0; padding: 10px 16px calc(16px + var(--safe-bottom)); display: flex; flex-direction: column; gap: 12px; box-shadow: 0 -10px 30px rgba(7, 20, 57, 0.18); animation: st-rise .22s var(--st-ease); }
.st-sheet-handle { align-self: center; width: 44px; height: 5px; border-radius: 999px; background: var(--st-line); }
.st-sheet h2 { font-size: 24px; font-weight: 800; letter-spacing: -0.01em; color: var(--st-ink); overflow-wrap: anywhere; line-height: 1.15; }
.st-sheet-sub { font-size: 16px; color: var(--st-ink-2); margin-top: -6px; }
.st-sheet-order { font-size: 15px; font-weight: 700; color: var(--st-ink-2); overflow-wrap: anywhere; }
.st-sheet-label { font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--st-ink-2); margin-top: 4px; }
.staff-space:has(.st-sheet) .tabbar, .staff-space:has(.st-sheet) .st-livebar { display: none; }
.st-pick { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.st-pick li { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--st-line-2); }
.st-pick-toggle { flex: 1; min-width: 0; min-height: 56px; display: flex; align-items: center; gap: 12px; border: 0; background: none; padding: 0; text-align: left; color: var(--st-ink); cursor: pointer; }
.st-pick-toggle .box { flex: none; width: 30px; height: 30px; border-radius: 9px; border: 2px solid var(--st-line); display: inline-flex; align-items: center; justify-content: center; color: #fff; transition: background-color .15s ease, border-color .15s ease; }
.st-pick-toggle .box.round { border-radius: 50%; }
.st-pick-toggle .box .ds-icon { width: 18px; height: 18px; }
.st-pick li.on .box { background: var(--st-ok); border-color: var(--st-ok); }
.st-pick-toggle .txt { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.st-pick-toggle strong { font-size: 17px; font-weight: 800; overflow-wrap: anywhere; }
.st-pick-toggle small { font-size: 14px; color: var(--st-ink-3); font-weight: 600; }
.st-pick-toggle[disabled] { cursor: not-allowed; opacity: .6; }
.st-stepper { flex: none; display: flex; align-items: center; gap: 6px; }
.st-stepper button { width: 48px; height: 48px; border-radius: 12px; border: 1px solid var(--st-line); background: var(--st-card); color: var(--st-ink); font-size: 22px; font-weight: 800; cursor: pointer; }
.st-stepper button[disabled] { color: var(--st-ink-3); background: var(--st-line-2); cursor: not-allowed; }
.st-stepper output { min-width: 28px; text-align: center; font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--st-ink); }
.st-link { align-self: flex-start; min-height: 44px; border: 0; background: none; padding: 0; color: var(--st-ink); font-weight: 800; font-size: 15px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.st-reasons { display: flex; flex-direction: column; gap: 10px; }
.st-reasons button { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; min-height: 72px; text-align: left; border-radius: var(--st-r-m); border: 1.5px solid var(--st-line); background: var(--st-card); color: var(--st-ink); cursor: pointer; }
.st-reasons button strong { font-size: 17px; }
.st-reasons button span { font-size: 15px; color: var(--st-ink-2); }
.st-reasons button.on { border-color: var(--st-ink); box-shadow: 0 0 0 1px var(--st-ink); }
.staff-space .btn.primary.st-cta { background: var(--st-red); border-color: var(--st-red); color: #fff; }
.staff-space .btn.primary.st-cta[disabled] { background: var(--st-line-2); border-color: var(--st-line-2); color: var(--st-ink-3); }

/* Confirmation discrète (L5, 21/10) : une ligne dans la carte du voyageur, jamais par-dessus la liste */
.st-gift-flash { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 8px 12px; border-radius: var(--st-r-s); font-size: 15px; font-weight: 700; animation: st-fade .18s ease-out; }
.st-gift-flash .ds-icon { flex: none; width: 18px; height: 18px; margin-top: 2px; }
.st-gift-flash.ok { background: var(--st-ok-soft); color: var(--st-ok); }
.st-gift-flash.ko { background: var(--st-red-soft); color: var(--st-red-ink); }
.st-sheet-label small { text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--st-ink-3); }
.st-input { width: 100%; min-height: var(--st-touch); padding: 0 14px; border-radius: var(--st-r-s); border: 1px solid var(--st-line); background: var(--st-card); color: var(--st-ink); font-size: 16px; }
.st-input:focus { outline: none; border-color: var(--st-ink); box-shadow: 0 0 0 3px rgba(15, 27, 61, 0.10); }

/* ─── Joindre un voyageur (L6) : fiche, coordonnées MYCOMM, actions au pouce ─────────────── */
.st-reach-link { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; margin-top: 2px; padding: 0 12px; border-radius: 10px; background: var(--st-info-soft); color: var(--st-navy-2); font-size: 14px; font-weight: 800; }
.st-reach-link .ds-icon { width: 16px; height: 16px; }
.st-reach-card { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 20px 16px; text-align: center; background: var(--st-card); border: 1px solid var(--st-line); border-radius: var(--st-r-l); box-shadow: var(--st-shadow-s); }
.st-reach-avatar { width: 72px; height: 72px; border-radius: 50%; background: var(--st-info-soft); color: var(--st-navy-2); display: inline-flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 800; }
.st-reach-card h1 { font-size: 24px; font-weight: 800; color: var(--st-ink); line-height: 1.15; overflow-wrap: anywhere; }
.st-reach-sub { font-size: 15px; color: var(--st-ink-2); overflow-wrap: anywhere; }
.st-reach-list { display: flex; flex-direction: column; background: var(--st-card); border: 1px solid var(--st-line); border-radius: var(--st-r-m); padding: 6px 16px; box-shadow: var(--st-shadow-s); }
.st-reach-order { font-size: 13px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--st-ink-2); padding-top: 10px; overflow-wrap: anywhere; }
.st-reach-line { display: flex; align-items: center; gap: 14px; padding: 12px 0; }
.st-reach-line + .st-reach-line { border-top: 1px solid var(--st-line-2); }
.st-reach-line .ico { flex: none; width: 44px; height: 44px; border-radius: 12px; background: var(--st-info-soft); color: var(--st-navy-2); display: inline-flex; align-items: center; justify-content: center; }
.st-reach-line .ico .ds-icon { width: 20px; height: 20px; }
.st-reach-line > div { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.st-reach-line small { font-size: 13px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--st-ink-3); }
.st-reach-line strong { font-size: 19px; font-weight: 800; color: var(--st-ink); font-variant-numeric: tabular-nums; }
.st-reach-line em { font-style: normal; font-size: 16px; color: var(--st-ink-3); }
.st-reach-line strong.st-reach-email { overflow-wrap: anywhere; font-size: 17px; }
.st-reach-mini { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 4px 0 10px; }
/*
  Fiche Joindre (correction du 22/10, maquette 12) : écran de tâche, sans barre d'onglets ; Appeler / E-mail dans une barre
  ancrée en bas, opaque, pleine largeur, au-dessus de la zone gestes d'Android (safe-area) : le contenu défile DESSOUS sans
  jamais être recouvert par des boutons flottants, et la marge du bas laisse lire la fin de la fiche. Retour : flèche de l'en-tête
  (collant) et « Revenir au pointage ».
*/
.staff-space { --st-actionbar-h: 76px; }
.staff-space:has(.content.st-task) { padding-bottom: calc(var(--safe-bottom) + 24px); }
.staff-space:has(.content.st-task) .tabbar,
.staff-space:has(.content.st-task) .st-livebar { display: none; }
.staff-space:has(.content.st-task):has(.st-actionbar) { padding-bottom: calc(var(--st-actionbar-h) + var(--safe-bottom) + 16px); }
.st-actionbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 35; display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
    padding: 10px max(16px, env(safe-area-inset-right, 0px)) calc(10px + var(--safe-bottom)) max(16px, env(safe-area-inset-left, 0px));
    background: rgba(245, 246, 250, 0.97); backdrop-filter: blur(10px); box-shadow: 0 -1px 0 var(--st-line), 0 -8px 24px rgba(15, 27, 61, 0.06); }
.st-actionbar.single { grid-template-columns: 1fr; }
.st-actionbar .btn { min-height: 56px; min-width: 0; }
.staff-space:has(input:focus, textarea:focus) .st-actionbar { display: none; }

/*
  ═══ Refonte terrain du 05/11 (recette du CTO sur Samsung S24+) : densité et hiérarchie ═══════════════════════════════════
  Constat : textes et cartes trop grands (« effet zoom »), la liste ne montrait que 4 à 5 clients par écran. Échelle resserrée
  (texte courant 15 px, titres 20-22 px, métadonnées 13 px), espacements de 8-12 px, cartes clients d'une ligne et demie ;
  zones tactiles CONSERVÉES (44 px au moins, 48 px pour les actions principales). Tailles en px, donc agrandies par le réglage
  « taille de police » d'Android (zoom du texte de la WebView) : le choix d'accessibilité de l'utilisateur est respecté.
*/
.staff-space { --st-touch: 48px; --mc-tabbar-h: 60px; --st-r-m: 14px; --st-r-l: 18px; font-size: 15px; }
.staff-space .topbar { min-height: calc(52px + var(--safe-top)); }
.staff-space .topbar .title { font-size: 16px; }
.staff-space .topbar .back, .staff-space .staff-refresh { width: 40px; height: 40px; }
.staff-space .content.staff { padding: 10px 14px 8px; gap: 12px; }
.staff-space .btn { font-size: 15px; }
.staff-space .card { padding: 14px; }
.staff-space .empty { padding: 20px 16px; }
.staff-space .empty strong { font-size: 16px; }
.staff-space .tabbar a { font-size: 12px; }
.staff-space .tabbar a .ds-icon { width: 22px; height: 22px; }
.st-greet h1 { font-size: 22px; }
.st-greet p { font-size: 15px; }
.staff-space .staff-next { padding: 14px 14px 12px; gap: 8px; }
.staff-space .staff-next-title { font-size: 19px; }
.staff-space .staff-next-time { font-size: 22px; }
.staff-space .staff-next-day, .st-hero-line { font-size: 14px; }
.st-hero-place { font-size: 15px; min-height: 40px; }
.st-hero-place small { display: block; font-size: 13px; font-weight: 500; opacity: .8; }
.st-presence strong { font-size: 20px; }
.st-presence span { font-size: 12px; }
.staff-space .staff-card { padding: 12px; gap: 12px; }
.staff-space .staff-card-time { width: 58px; padding-right: 10px; }
.staff-space .staff-card-time strong { font-size: 18px; }
.staff-space .staff-card-time small { font-size: 12px; }
.staff-space .staff-card-title { font-size: 15px; }
.staff-space .staff-card-line, .staff-space .staff-card-pax { font-size: 13px; }
.staff-card-plan { display: flex; flex-direction: column; gap: 1px; padding: 6px 10px; margin: 2px 0; border-radius: 10px; background: var(--st-info-soft); }
.staff-card-plan strong { font-size: 15px; font-weight: 800; color: var(--st-navy); }
.staff-card-plan span { font-size: 13px; color: var(--st-navy-2); }
.st-mhead { gap: 6px; }
.st-mhead h1 { font-size: 21px; }
.st-kicker { font-size: 12px; }
.st-tag { min-height: 26px; font-size: 13px; padding: 2px 10px; }
.st-seg { top: calc(52px + var(--safe-top)); }
.staff-space .staff-planning-day { top: calc(52px + var(--safe-top)); }
.st-seg a { min-height: 44px; font-size: 14px; }
.st-seg a .ds-icon { width: 18px; height: 18px; }
.st-block { padding: 14px; gap: 10px; }
.st-block > h2 { font-size: 12px; }
.st-when strong { font-size: 24px; }
.st-place { padding: 10px; }
.st-place strong { font-size: 15px; }
.st-place span { font-size: 14px; }
.st-big { font-size: 19px; }
.st-note { font-size: 14px; padding: 10px 12px; }
.st-search input { min-height: 46px; font-size: 15px; }
.st-chip { min-height: 36px; font-size: 14px; padding: 0 12px; }
.st-chip.warn:not(.on) { border-color: #F2D3A6; color: var(--st-warn); }
.st-pax { min-height: 60px; }
.st-pax-name { font-size: 15.5px; }
.st-pax-meta { font-size: 13px; }
.st-counter { min-height: 64px; padding: 10px; }
.st-counter strong { font-size: 22px; }
.st-toast { font-size: 14px; min-height: 52px; }
.st-sheet h2 { font-size: 20px; }

/* Accueil (écran principal d'une mission d'accueil) */
.acc-head { display: flex; flex-direction: column; gap: 2px; padding: 0 2px; }
.acc-head h1 { font-size: 20px; font-weight: 800; letter-spacing: -0.01em; color: var(--st-ink); line-height: 1.15; }
.acc-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.acc-kpi-cell { display: flex; flex-direction: column; gap: 1px; padding: 8px 10px; border-radius: 12px; background: var(--st-card); border: 1px solid var(--st-line); }
.acc-kpi-cell strong { font-size: 22px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; color: var(--st-ink); }
.acc-kpi-cell span { font-size: 12px; font-weight: 700; color: var(--st-ink-2); line-height: 1.2; }
.acc-kpi-cell.warn strong { color: var(--st-warn); }
.acc-kpi-cell.ok strong { color: var(--st-ok); }
.acc-gifts { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; background: var(--st-red-soft); color: var(--st-red-ink); font-size: 13px; }
.acc-gifts > .ds-icon { flex: none; width: 20px; height: 20px; }
.acc-gifts-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.acc-gifts-txt strong { font-weight: 800; font-variant-numeric: tabular-nums; }
.acc-gifts .st-progress { height: 5px; background: rgba(180, 24, 44, 0.12); }
.acc-gifts .st-progress > span { background: var(--st-red); }
/* Recherche et jours collés sous les onglets : toujours à portée de pouce pendant le défilement. */
.acc-tools { position: sticky; top: calc(52px + var(--safe-top) + 52px); z-index: 14; display: flex; flex-direction: column; gap: 8px; margin: 0 -14px; padding: 6px 14px 8px; background: var(--st-bg); }
.acc-views { margin: 0 -14px; padding: 0 14px 2px; }
.acc-scope { font-size: 13px; color: var(--st-ink-3); padding: 0 2px; }
.acc-section { display: flex; align-items: baseline; gap: 8px; margin: 6px 2px 0; font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--st-ink-2); }
.acc-section small { font-size: 12px; color: var(--st-ink-3); letter-spacing: 0; }
.acc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; background: var(--st-card); border: 1px solid var(--st-line); border-radius: var(--st-r-m); overflow: hidden; }
.acc-row { display: flex; align-items: center; gap: 6px; padding: 6px 6px 6px 0; min-height: 60px; border-top: 1px solid var(--st-line-2); transition: background-color .25s ease; }
.acc-row:first-child { border-top: 0; }
.acc-row.present { background: #F7FCF9; }
.acc-row.busy { opacity: .65; }
.acc-row.fresh { box-shadow: inset 3px 0 0 var(--st-warn); animation: st-fresh 1.2s ease-out 2; }
.acc-open { flex: 1; min-width: 0; min-height: 48px; display: flex; align-items: center; gap: 10px; padding: 0 4px 0 10px; border: 0; background: none; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.acc-txt { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.acc-txt .st-pax-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc-txt .st-pax-meta { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; line-height: 1.3; }
.acc-txt .st-acc-flash { font-size: 13px; margin-top: 1px; }
.acc-txt .st-pax-meta.ok { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc-avatar { flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--st-line-2); color: var(--st-ink-2); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; }
.acc-avatar .ds-icon { width: 18px; height: 18px; }
.acc-avatar.present { background: var(--st-ok-soft); color: var(--st-ok); }
.acc-avatar.served { background: var(--st-ok); color: #fff; }
.acc-avatar.lead { background: var(--st-red-soft); color: var(--st-red-ink); }
.acc-avatar.lg { width: 52px; height: 52px; font-size: 18px; }
.acc-acts { flex: none; display: flex; gap: 6px; }
.acc-btn { width: 56px; min-height: 48px; padding: 4px 2px; border-radius: 12px; border: 1.5px solid var(--st-line); background: var(--st-card); color: var(--st-navy); font: inherit; font-size: 11px; font-weight: 800; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; cursor: pointer; transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .12s var(--st-ease); }
.acc-btn .ds-icon { width: 20px; height: 20px; }
.acc-btn:active { transform: scale(0.95); }
.acc-btn.arrive { border-color: var(--st-navy); }
.acc-btn.gift { border-color: var(--st-red); color: var(--st-red-ink); }
.acc-btn.on { background: var(--st-ok); border-color: var(--st-ok); color: #fff; }
.acc-btn[disabled] { cursor: not-allowed; opacity: .38; transform: none; }
.acc-btn.wide { width: auto; flex: 1; flex-direction: row; gap: 8px; font-size: 15px; min-height: 52px; }
.acc-btn.wide.gift:not(.on) { background: var(--st-red); color: #fff; }
/* Fiche client (volet) */
.acc-fiche { gap: 10px; }
.acc-fiche-head { display: flex; align-items: center; gap: 12px; }
.acc-fiche-head > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.acc-fiche-head h2 { font-size: 20px; }
.acc-fiche-head span { font-size: 14px; color: var(--st-ink-2); overflow-wrap: anywhere; }
.acc-close { flex: none; width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--st-line); background: var(--st-card); color: var(--st-ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.acc-fiche-acts { display: flex; gap: 8px; }
.acc-facts { margin: 0; display: flex; flex-direction: column; border: 1px solid var(--st-line); border-radius: 12px; overflow: hidden; }
.acc-facts > div { display: grid; grid-template-columns: 112px 1fr; gap: 8px; padding: 9px 12px; border-top: 1px solid var(--st-line-2); font-size: 14px; }
.acc-facts > div:first-child { border-top: 0; }
.acc-facts dt { color: var(--st-ink-3); font-weight: 700; font-size: 13px; }
.acc-facts dd { margin: 0; color: var(--st-ink); font-weight: 600; display: flex; flex-direction: column; gap: 2px; overflow-wrap: anywhere; }
.acc-facts dd small { font-size: 13px; font-weight: 500; color: var(--st-ink-2); }
.acc-contact { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.acc-contact li { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: 12px; background: var(--st-bg); font-size: 15px; }
.acc-contact li > span { display: flex; align-items: center; gap: 8px; min-height: 32px; overflow-wrap: anywhere; }
.acc-contact .ds-icon { flex: none; width: 18px; height: 18px; color: var(--st-ink-3); }
.acc-contact a { color: var(--st-navy); font-weight: 800; }
.acc-contact em { font-style: normal; color: var(--st-ink-3); }
.acc-hint { font-size: 13px; color: var(--st-ink-3); }
.acc-history { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.acc-history li { display: flex; gap: 10px; font-size: 14px; padding-left: 10px; border-left: 3px solid var(--st-line); }
.acc-history li.ok { border-left-color: var(--st-ok); }
.acc-history li.ko { border-left-color: var(--st-red); }
.acc-history strong { flex: none; min-width: 70px; font-variant-numeric: tabular-nums; color: var(--st-ink); }
.acc-history span { color: var(--st-ink-2); }
/* Mission : accès direct à l'accueil, équipe, détail replié */
.acc-today { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: var(--st-r-m); background: var(--st-navy); color: #fff; box-shadow: var(--st-shadow-s); text-decoration: none; }
.acc-today-ico { flex: none; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 255, 255, 0.12); display: inline-flex; align-items: center; justify-content: center; }
.acc-today-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.acc-today-txt strong { font-size: 16px; font-weight: 800; }
.acc-today-txt span { font-size: 13px; opacity: .85; }
.acc-today-go { flex: none; display: inline-flex; align-items: center; gap: 2px; min-height: 40px; padding: 0 12px; border-radius: 10px; background: var(--st-red); font-weight: 800; font-size: 14px; }
.st-team { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.st-team-row { display: flex; align-items: center; gap: 10px; min-height: 48px; }
.st-team-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.st-team-txt strong { font-size: 15px; color: var(--st-ink); overflow-wrap: anywhere; }
.st-team-txt small { font-size: 13px; color: var(--st-ink-3); font-weight: 700; }
.st-team-row.lead .st-team-txt small { color: var(--st-red-ink); }
.st-icon-btn { flex: none; width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--st-line); background: var(--st-card); color: var(--st-navy); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.st-actions-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.st-actions-row .btn { min-width: 0; }
.st-more { border-top: 1px solid var(--st-line-2); padding-top: 8px; display: flex; flex-direction: column; gap: 8px; }
.st-more summary { min-height: 40px; display: flex; align-items: center; font-size: 14px; font-weight: 800; color: var(--st-ink-2); cursor: pointer; list-style: none; }
.st-more summary::-webkit-details-marker { display: none; }
.st-more summary::after { content: "▾"; margin-left: auto; color: var(--st-ink-3); }
.st-more[open] summary::after { content: "▴"; }
.st-more[open] { gap: 10px; }

/* ─── Recette CTO du 06/11 : Aujourd'hui, fiche mission, Pointage minimal, Liste, fiche voyageur, clavier ─────────────── */

/* Aujourd'hui : cartes de mission ENTIÈREMENT cliquables (aucun bouton dedans). */
.st-today { display: flex; flex-direction: column; gap: 10px; }
.st-mcard { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 44px 14px 14px; border-radius: var(--st-r-m); background: var(--st-card); border: 1px solid var(--st-line); box-shadow: var(--st-shadow-s); color: var(--st-ink); text-decoration: none; transition: transform .12s ease; -webkit-tap-highlight-color: transparent; }
.st-mcard:active { transform: scale(0.985); }
.st-mcard-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.st-mcard-status { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; padding: 2px 10px; border-radius: 999px; background: var(--st-info-soft); color: var(--st-navy-2); font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.st-mcard-status.live { background: var(--st-red); color: #fff; }
.st-mcard-status.live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: st-pulse 1.6s ease-in-out infinite; }
.st-mcard-when { font-size: 13px; font-weight: 700; color: var(--st-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.st-mcard-title { font-size: 17px; font-weight: 800; line-height: 1.2; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.st-mcard-line { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--st-ink-2); min-width: 0; }
.st-mcard-line > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-mcard-line .ds-icon { flex: none; width: 16px; height: 16px; color: var(--st-ink-3); }
.st-mcard-line small { flex: none; font-size: 12px; color: var(--st-ink-3); }
.st-mcard-flags { display: flex; flex-wrap: wrap; gap: 6px; }
.st-mcard-chev { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--st-ink-3); display: inline-flex; }
.st-mcard.featured { background: linear-gradient(160deg, var(--st-navy-2) 0%, var(--st-navy) 75%); border-color: transparent; color: #fff; box-shadow: var(--st-shadow); padding: 16px 44px 16px 16px; gap: 8px; }
.st-mcard.featured .st-mcard-title { font-size: 20px; }
.st-mcard.featured .st-mcard-status { background: rgba(255, 255, 255, 0.14); color: #fff; }
.st-mcard.featured .st-mcard-status.live { background: var(--st-red); }
.st-mcard.featured .st-mcard-when, .st-mcard.featured .st-mcard-line { color: rgba(255, 255, 255, 0.88); }
.st-mcard.featured .st-mcard-line .ds-icon, .st-mcard.featured .st-mcard-line small, .st-mcard.featured .st-mcard-chev { color: rgba(255, 255, 255, 0.6); }
@keyframes st-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.st-upnext { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 8px 12px; border-radius: var(--st-r-m); border: 1px dashed var(--st-line); color: var(--st-ink-2); font-size: 14px; text-decoration: none; }
.st-upnext > span { flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.st-upnext small { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--st-ink-3); }
.st-upnext .ds-icon { flex: none; width: 18px; height: 18px; color: var(--st-ink-3); }
.st-empty-day { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; padding: 28px 20px 22px; border-radius: var(--st-r-l); background: var(--st-card); border: 1px solid var(--st-line); box-shadow: var(--st-shadow-s); color: var(--st-ink-2); font-size: 15px; line-height: 1.4; }
.st-empty-day strong { font-size: 18px; color: var(--st-ink); }
.st-empty-day b { color: var(--st-ink); font-weight: 800; }
.st-empty-ico { width: 64px; height: 64px; border-radius: 50%; background: var(--st-warn-soft); color: var(--st-warn); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 2px; }
.st-empty-day .btn { width: 100%; max-width: 320px; }

/* Fiche mission : l'action d'abord, puis quand / où, rôle, voyageurs. */
.st-go { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 14px; border-radius: var(--st-r-m); background: var(--st-red); color: #fff; text-decoration: none; box-shadow: 0 8px 20px rgba(215, 44, 64, 0.22); -webkit-tap-highlight-color: transparent; }
.st-go:active { transform: scale(0.985); }
.st-go-ico { flex: none; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 255, 255, 0.16); display: inline-flex; align-items: center; justify-content: center; }
.st-go-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.st-go-txt strong { font-size: 17px; font-weight: 800; }
.st-go-txt span { font-size: 13px; opacity: .92; }
.st-go.off { background: var(--st-card); color: var(--st-ink-2); border: 1px solid var(--st-line); box-shadow: none; }
.st-go.off .st-go-ico { background: var(--st-line-2); color: var(--st-ink-3); }
.st-go.off strong { color: var(--st-ink); }
.st-place { align-items: center; }
.st-place > div { flex: 1; min-width: 0; }
.st-role { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; border-radius: 12px; background: var(--st-bg); font-size: 14px; color: var(--st-ink-2); }
.st-role strong { font-size: 15px; color: var(--st-navy); }
.st-role strong.lead { color: var(--st-red-ink); }
.st-stats { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; }
.st-stats > div { display: flex; flex-direction: column; gap: 1px; padding: 8px 10px; border-radius: 12px; background: var(--st-bg); min-width: 0; }
.st-stats strong { font-size: 22px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; color: var(--st-ink); }
.st-stats span { font-size: 12px; font-weight: 700; color: var(--st-ink-2); line-height: 1.2; }
.st-stats .ok strong { color: var(--st-ok); }
.st-stats .warn strong { color: var(--st-warn); }
.st-linkrow { display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--st-line); background: var(--st-card); color: var(--st-ink); text-decoration: none; -webkit-tap-highlight-color: transparent; }
.st-linkrow:active { background: var(--st-bg); }
.st-linkrow .ico { flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--st-info-soft); color: var(--st-navy); display: inline-flex; align-items: center; justify-content: center; }
.st-linkrow .txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.st-linkrow .txt strong { font-size: 16px; font-weight: 800; }
.st-linkrow .txt small { font-size: 13px; color: var(--st-ink-2); }
.st-linkrow > .ds-icon { flex: none; color: var(--st-ink-3); }

/* Pointage : une ligne = le nom + « Arrivée » + « Cadeau » (cibles 48 px), rien d'autre. */
.acc-list:not(.as-list) .acc-row { min-height: 56px; padding: 4px 6px 4px 0; }
.acc-list:not(.as-list) .acc-open { padding-left: 14px; gap: 8px; }
.acc-list:not(.as-list) .acc-open .st-pax-name { font-size: 16px; font-weight: 700; color: var(--st-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.acc-list:not(.as-list) .acc-btn { width: 66px; }
.acc-mini { flex: none; font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 999px; }
.acc-mini.warn { background: var(--st-warn-soft); color: var(--st-warn); }
.acc-btn.gift.part { background: var(--st-warn-soft); border-color: var(--st-warn); color: var(--st-warn); }
/* Sans onglets (Liste) : la recherche se colle directement sous l'en-tête. */
.acc:not(:has(.st-seg)) .acc-tools { top: calc(52px + var(--safe-top)); }

/* Liste des voyageurs : lignes de consultation, toute la ligne ouvre la fiche. */
.acc-list.as-list .acc-row { padding: 0; min-height: 60px; }
.acc-list.as-list .acc-open { padding: 8px 12px; gap: 12px; }
.acc-list.as-list .acc-txt { flex: 1; }
.acc-list.as-list .st-pax-meta { -webkit-line-clamp: 1; font-size: 13px; color: var(--st-ink-2); }
.acc-list.as-list .acc-open > .ds-icon { flex: none; width: 18px; height: 18px; color: var(--st-ink-3); }
.acc-states { flex: none; display: inline-flex; gap: 4px; }
.acc-state { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--st-line-2); color: var(--st-ink-3); }
.acc-state .ds-icon { width: 15px; height: 15px; }
.acc-state.on { background: var(--st-ok-soft); color: var(--st-ok); }
.acc-state.warn { background: var(--st-warn-soft); color: var(--st-warn); }
.acc-state.gift.on { background: var(--st-ok); color: #fff; }
.acc-summary { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 14px; color: var(--st-ink-2); margin: 0 2px; }
.acc-summary strong { font-size: 17px; color: var(--st-ink); font-variant-numeric: tabular-nums; }
.acc-summary .ok strong { color: var(--st-ok); }
.acc-summary .gold strong { color: var(--st-red-ink); }

/* Liste PAX d'une mission sans accueil : même présentation, ligne cliquable. */
.staff-space .staff-pax-row { padding: 0; }
.staff-pax-open { width: 100%; display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 12px; border: 0; background: none; text-align: left; font: inherit; color: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.staff-pax-open:active { background: var(--st-bg); }
.staff-pax-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.staff-pax-open > .ds-icon { flex: none; width: 18px; height: 18px; color: var(--st-ink-3); }
.staff-space .staff-search { position: sticky; top: calc(52px + var(--safe-top)); z-index: 14; background: var(--st-bg); }

/* Fiche voyageur : hôtel (nom, adresse, check-in / check-out), coordonnées avec « Appeler ». */
.acc-hotel { display: flex; flex-direction: column; gap: 8px; padding: 12px; border: 1px solid var(--st-line); border-radius: 12px; }
.acc-hotel-name { font-size: 16px; font-weight: 800; color: var(--st-ink); overflow-wrap: anywhere; }
.acc-hotel-name.none { color: var(--st-ink-3); font-weight: 700; }
.acc-hotel-addr { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--st-ink-2); }
.acc-hotel-addr > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.acc-hotel-addr > .ds-icon { flex: none; width: 16px; height: 16px; color: var(--st-ink-3); }
.acc-hotel-addr.none { color: var(--st-ink-3); }
.acc-hotel-dates { display: grid; grid-template-columns: 1fr 1fr auto; gap: 6px; }
.acc-hotel-dates > div { display: flex; flex-direction: column; gap: 1px; padding: 8px 10px; border-radius: 10px; background: var(--st-bg); min-width: 0; }
.acc-hotel-dates small { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--st-ink-3); }
.acc-hotel-dates strong { font-size: 14px; font-weight: 800; color: var(--st-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc-hotel-dates .nights strong { color: var(--st-navy-2); }
.acc-contact-line { display: flex; align-items: center; gap: 8px; min-height: 44px; }
.acc-contact-line .val { flex: 1; min-width: 0; font-weight: 800; color: var(--st-ink); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.acc-contact-line em { flex: 1; }
.acc-call { flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px; border-radius: 12px; border: 0; background: var(--st-ok); color: #fff; font: inherit; font-weight: 800; font-size: 14px; cursor: pointer; }
.acc-contact .acc-call .ds-icon { color: #fff; width: 16px; height: 16px; }
.acc-call.ghost { background: var(--st-card); color: var(--st-navy); border: 1px solid var(--st-line); }
/* Volet plus haut que l'écran : il défile, ses blocs ne sont jamais écrasés (le bloc « Accueil » était tronqué). */
.st-sheet > * { flex-shrink: 0; }

/* Clavier ouvert (js/keyboard.js) : onglets de bas d'écran et de mission retirés, recherche collée sous l'en-tête. Marge basse =
   la seule hauteur RECOUVERTE par le clavier (--kb-overlay, vue superposée) + 12 px. Vue redimensionnée (Android, mesuré sur
   S24+ le 06/11 : la vue s'arrête au bord du clavier) : --kb-overlay = 0, aucune marge ajoutée ; une liste courte tient au-dessus
   du clavier, une longue défile sous la recherche collée. L'ancienne marge de 70vh laissait, en fin de liste, le dernier résultat
   caché sous la recherche et 344 px de vide (mesuré). */
.kb-open .staff-space { padding-bottom: 0; }
.kb-open .staff-space .tabbar, .kb-open .staff-space .st-livebar, .kb-open .st-toast, .kb-open .st-seg { display: none; }
.kb-open .acc-tools { top: calc(52px + var(--safe-top)); }
.kb-open .staff-space .content.staff { padding-bottom: calc(var(--kb-overlay, 0px) + 12px); }