/* ══════════════════════════════════════════════════════════════════════════
   PZ_APP_CAISSE_V3_9aou · design de la caisse (Claude Design), TABLETTE seule.

   Chaque regle est prefixee par `.pzc-v3`, classe posee sur le conteneur
   uniquement au-dela de 900 px en paysage. Le CSS d'origine partage 11 noms
   de classes avec la caisse telephone (.pzc-tile, .pzc-line, .pzc-grid…) :
   sans ce scope, le telephone aurait ete repeint.

   Source : design_handoff_caisse/pulzar-caisse.css, 9 aout 2026.
   ══════════════════════════════════════════════════════════════════════════ */

/* ============================================================
   Pulzar · Caisse v4
   Feuille de style de la refonte de l'écran de caisse.
   À charger APRÈS tokens.css. Aucune dépendance, aucun build.

   Sortie des 1 684 lignes de CSS en ligne de admin/caisse.php :
   ce fichier les remplace et se met en cache.

   Sommaire
     1.  Réglages de base et polices
     2.  Fond aurora + grain
     3.  Coquille de l'écran de vente
     4.  Barre supérieure
     5.  Arrivées à encaisser
     6.  Créneaux par salle (3 densités)
     7.  Recherche et catégories
     8.  Grille de produits
     9.  Panneau ticket
     10. Modale d'encaissement et pavé numérique
     11. États (vide, chargement, succès, hors ligne, erreur)
     12. Formats tablette et zones sûres
     13. Clavier système
   ============================================================ */

/* ---------- 1. Réglages de base ---------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Archivo:wght@600;700;800;900&family=JetBrains+Mono:wght@500;600&display=swap');

:root {
  /* Compléments propres à la caisse, absents des tokens globaux */
  --pzc-panel: #111116;                       /* fond du panneau ticket */
  --pzc-glass: linear-gradient(172deg, rgba(255,255,255,.045), rgba(255,255,255,.014));
  --pzc-glass-line: rgba(255,255,255,.08);
  --pzc-sel-bg: rgba(108,76,241,.13);
  --pzc-sel-line: rgba(108,76,241,.45);
  --pzc-key-bg: rgba(255,255,255,.055);
  --pzc-key-line: rgba(255,255,255,.10);

  /* Cibles tactiles · ne jamais descendre en dessous */
  --pzc-touch-money: 88px;                    /* money-path */
  --pzc-touch: 44px;                          /* tout le reste */

  /* Gabarits mesurés */
  --pzc-ticket-w: 404px;
  --pzc-topbar-h: 58px;
  --pzc-slot-h: 60px;                         /* 1–2 salles */
  --pzc-tile-h: 104px;

  /* Zones sûres iOS */
  --pzc-safe-top: env(safe-area-inset-top, 0px);
  --pzc-safe-bottom: env(safe-area-inset-bottom, 0px);
}.pzc-v3 *, .pzc-v3 *::before, .pzc-v3 *::after { box-sizing: border-box; }.pzc-v3, .pzc-v3 * { -webkit-tap-highlight-color: transparent; }.pzc-v3 {
  margin: 0;
  background: var(--pzds-bg);
  color: var(--pzds-text);
  font-family: var(--pzds-font-body);
  font-size: 14px;
  line-height: 1.45;
  overscroll-behavior: none;                  /* pas de rebond iOS sur le comptoir */
  -webkit-user-select: none;
  user-select: none;
  touch-action: manipulation;                 /* supprime le délai de 300 ms */
}.pzc-v3 input, .pzc-v3 textarea { -webkit-user-select: text; user-select: text; }.pzc-v3 a { color: var(--pzds-lavender); text-decoration: none; }.pzc-v3 a:hover { color: var(--pzds-lavender-2); }.pzc-v3 /* Tout montant, partout, sans exception. */
.pzc-money {
  font-family: var(--pzds-font-display);
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}.pzc-v3 /* Chiffres techniques : heures, quantités, n° de ticket, comptage. */
.pzc-num {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}.pzc-v3 .pzc-label {
  font-family: var(--pzds-font-display);
  font-weight: 800;
  font-size: 12.5px;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: var(--pzds-text-3);
}.pzc-v3 /* ---------- 2. Fond aurora + grain -------------------------- */

.pzc-aurora { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }.pzc-v3 .pzc-aurora::before, .pzc-v3 .pzc-aurora::after {
  content: ''; position: absolute; border-radius: 50%; filter: blur(44px);
}.pzc-v3 .pzc-aurora::before {
  top: -220px; left: -120px; width: 660px; height: 470px;
  background: radial-gradient(closest-side, rgba(108,76,241,.13), transparent 70%);
  animation: pzc-drift-a 18s ease-in-out infinite;
}.pzc-v3 .pzc-aurora::after {
  top: -160px; right: -140px; width: 560px; height: 420px;
  background: radial-gradient(closest-side, rgba(224,86,138,.08), transparent 70%);
  animation: pzc-drift-b 22s ease-in-out infinite;
}.pzc-v3 @keyframes pzc-drift-a {
  0%,100% { transform: translate(0,0) scale(1); }
  50%     { transform: translate(60px,30px) scale(1.15); }
}
@keyframes pzc-drift-b {
  0%,100% { transform: translate(0,0) scale(1.1); }
  50%     { transform: translate(-50px,20px) scale(.95); }
}
@keyframes pzc-pulse { 0%,100% { opacity: .5 } 50% { opacity: .95 } }

.pzc-grain {
  position: absolute; inset: 0; pointer-events: none;
  opacity: .045; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Respecte le réglage système. Le comptoir tourne parfois 14 h d'affilée. */
@media (prefers-reduced-motion: reduce) {.pzc-v3 .pzc-aurora::before, .pzc-v3 .pzc-aurora::after, .pzc-v3 *, .pzc-v3 *::before, .pzc-v3 *::after {
    animation: none !important; transition: none !important;
  }
}.pzc-v3 /* ---------- 3. Coquille de l'écran de vente ----------------- */

.pzc-shell {
  position: relative;
  height: 100dvh;                             /* dvh, pas vh : la barre d'URL Android */
  display: flex; flex-direction: column;
  overflow: hidden;
}.pzc-v3 .pzc-body { position: relative; flex: 1; display: flex; min-height: 0; }.pzc-v3 .pzc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }.pzc-v3 /* La grille est la SEULE zone qui cède de la hauteur. */
.pzc-main > .pzc-grid-wrap { flex: 1; min-height: 0; overflow: hidden; }.pzc-v3 /* ---------- 4. Barre supérieure ----------------------------- */

.pzc-topbar {
  position: relative; z-index: 2;
  flex: 0 0 var(--pzc-topbar-h);
  display: flex; align-items: center; gap: 16px;
  padding: 0 18px;
  border-bottom: 1px solid var(--pzc-glass-line);
}.pzc-v3 .pzc-logo {
  width: 30px; height: 30px; border-radius: 9px;
  background: conic-gradient(from 210deg,#6c4cf1,#e0568a,#e0892f,#2f8a5b,#6c4cf1);
  display: grid; place-items: center;
  box-shadow: 0 4px 16px rgba(108,76,241,.4);
}.pzc-v3 .pzc-logo > span {
  width: 22px; height: 22px; border-radius: 6.5px; background: var(--pzds-bg);
  display: grid; place-items: center;
  font-family: 'Archivo Expanded', var(--pzds-font-display);
  font-weight: 800; font-size: 12px;
}.pzc-v3 .pzc-live { display: flex; align-items: center; gap: 7px; font-weight: 600; font-size: 12px; color: var(--pzds-ok); }.pzc-v3 .pzc-live::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%;
  background: var(--pzds-ok); animation: pzc-pulse 2.4s ease-in-out infinite;
}.pzc-v3 .pzc-avatar {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg,#6c4cf1,#e0568a);
  display: grid; place-items: center;
  font-weight: 700; font-size: 11px; color: #fff;
}.pzc-v3 /* ---------- 5. Arrivées à encaisser ------------------------- */

.pzc-arrivals { display: flex; gap: 10px; padding: 0 18px; }.pzc-v3 .pzc-arrival {
  flex: 1; min-width: 0; height: 88px;
  display: flex; align-items: center; gap: 13px;
  padding: 0 16px; border-radius: var(--pzds-r-card);
  background: var(--pzc-glass); border: 1px solid var(--pzc-glass-line);
}.pzc-v3 .pzc-arrival[data-next] { background: var(--pzc-sel-bg); border-color: var(--pzc-sel-line); }.pzc-v3 .pzc-arrival-bar { flex: 0 0 6px; width: 6px; height: 56px; border-radius: 4px; }.pzc-v3 .pzc-arrival-txt { min-width: 0; flex: 1; }.pzc-v3 /* Le nom du client occupe sa PROPRE ligne : à 1280 px il se fait tronquer sinon. */
.pzc-arrival-name {
  font-weight: 600; font-size: 15.5px; color: var(--pzds-text-strong);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}.pzc-v3 .pzc-arrival-meta {
  margin-top: 4px; font-size: 12.5px; color: var(--pzds-text-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}.pzc-v3 /* Colonne de montant FIXE. Le nom s'abrège, le montant jamais. */
.pzc-arrival-amt { flex: 0 0 104px; width: 104px; text-align: right; }.pzc-v3 .pzc-arrival-amt .pzc-money { font-size: 22px; color: var(--pzds-text-strong); }.pzc-v3 .pzc-arrival-more {
  flex: 0 0 132px; height: 88px; border-radius: var(--pzds-r-card);
  border: 1px solid rgba(255,255,255,.1);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
}.pzc-v3 /* Repli sur écran court : une seule ligne, dépliable en surcouche. */
.pzc-arrivals-collapsed {
  height: 44px; display: flex; align-items: center; gap: 11px;
  padding: 0 14px; border-radius: var(--pzds-r-field);
  background: rgba(108,76,241,.11); border: 1px solid rgba(108,76,241,.4);
}.pzc-v3 /* ---------- 6. Créneaux par salle --------------------------- */
/* Le nombre de salles change la DENSITÉ, pas la disposition.
   Jamais de repli derrière un bouton : le caissier répond pendant qu'on lui parle. */

.pzc-slots { display: flex; flex-direction: column; gap: 8px; padding: 0 18px; }.pzc-v3 /* Au-delà de 6 salles : hauteur figée, défilement interne. */
.pzc-slots[data-overflow] {
  max-height: 294px;                          /* 6 lignes compactes + gaps */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}.pzc-v3 .pzc-band { display: flex; flex-direction: column; gap: 6px; }.pzc-v3 .pzc-band-name {
  display: flex; align-items: center; gap: 7px;
  font-weight: 700; font-size: 11.5px; letter-spacing: .5px; text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}.pzc-v3 .pzc-band-name::before { content: ''; flex: 0 0 4px; width: 4px; height: 16px; border-radius: 3px; background: currentColor; }.pzc-v3 .pzc-band-row { display: flex; gap: 8px; }.pzc-v3 .pzc-slot {
  flex: 1; min-width: 0; height: var(--pzc-slot-h);
  border-radius: var(--pzds-r-field);
  border: 1px solid rgba(255,255,255,.08);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  background: none;
  cursor: pointer;
}.pzc-v3 .pzc-slot time { font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 600; font-size: 15px; color: var(--pzds-text); }.pzc-v3 .pzc-slot small { font-weight: 600; font-size: 11px; color: var(--pzds-text-3); }.pzc-v3 .pzc-slot[data-state="libre"] { background: rgba(90,209,154,.08); border-color: rgba(90,209,154,.30); }.pzc-v3 .pzc-slot[data-state="libre"] small { color: var(--pzds-ok); }.pzc-v3 .pzc-slot[data-state="partiel"] { background: rgba(255,179,122,.10); border-color: rgba(255,179,122,.34); }.pzc-v3 .pzc-slot[data-state="partiel"] small { color: var(--pzds-warn); }.pzc-v3 .pzc-slot[data-state="encours"] { background: rgba(108,76,241,.18); border-color: rgba(108,76,241,.60); }.pzc-v3 .pzc-slot[data-state="encours"] time { color: var(--pzds-text-strong); }.pzc-v3 .pzc-slot[data-state="encours"] small { color: var(--pzds-lavender-2); }.pzc-v3 /* Réservé, complet, entretien, fermé : non cliquables, sans couleur de statut. */
.pzc-slot[data-state="reserve"], .pzc-v3 .pzc-slot[data-state="complet"], .pzc-v3 .pzc-slot[data-state="entretien"], .pzc-v3 .pzc-slot[data-state="ferme"] { cursor: default; }.pzc-v3 .pzc-slot[data-state="reserve"] time, .pzc-v3 .pzc-slot[data-state="complet"] time, .pzc-v3 .pzc-slot[data-state="entretien"] time, .pzc-v3 .pzc-slot[data-state="ferme"] time { color: var(--pzds-text-3); }.pzc-v3 /* 3–4 salles : deux colonnes. */
.pzc-slots[data-density="two-col"] { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }.pzc-v3 .pzc-slots[data-density="two-col"] .pzc-slot { height: 56px; }.pzc-v3 /* 5–6 salles : mode compact, nom à gauche dans une colonne fixe. */
.pzc-slots[data-density="compact"] { gap: 5px; }.pzc-v3 .pzc-slots[data-density="compact"] .pzc-band { flex-direction: row; align-items: center; gap: 8px; height: 44px; }.pzc-v3 .pzc-slots[data-density="compact"] .pzc-band-name { flex: 0 0 146px; width: 146px; }.pzc-v3 .pzc-slots[data-density="compact"] .pzc-band-row { flex: 1; min-width: 0; }.pzc-v3 .pzc-slots[data-density="compact"] .pzc-slot {
  height: 44px; flex-direction: row; gap: 8px;
}.pzc-v3 .pzc-slots[data-density="compact"] .pzc-slot time { font-size: 14px; }.pzc-v3 .pzc-slots[data-density="compact"] .pzc-slot small { font-size: 10.5px; }.pzc-v3 .pzc-band-next {
  flex: 0 0 42px; width: 42px; height: 44px;
  border-radius: var(--pzds-r-field); border: 1px solid rgba(255,255,255,.1);
  display: grid; place-items: center; color: var(--pzds-text-3);
}.pzc-v3 /* ---------- 7. Recherche et catégories ---------------------- */

.pzc-search {
  flex: 1; height: 52px; display: flex; align-items: center; gap: 10px;
  padding: 0 15px; border-radius: 13px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.11);
  color: var(--pzds-text-3); font-size: 14px;
}.pzc-v3 .pzc-cats {
  display: flex; gap: 8px; padding: 0 18px 12px;
  overflow-x: auto; scrollbar-width: none;    /* défile, ne passe jamais à la ligne */
}.pzc-v3 .pzc-cats::-webkit-scrollbar { display: none; }.pzc-v3 .pzc-cat {
  flex: 0 0 auto; height: var(--pzc-touch);
  display: flex; align-items: center; gap: 8px;
  padding: 0 16px; border-radius: var(--pzds-r-field);
  border: 1px solid rgba(255,255,255,.1);
  font-weight: 600; font-size: 13px; color: var(--pzds-text-2);
  background: none; white-space: nowrap;
}.pzc-v3 .pzc-cat[aria-selected="true"] {
  background: #2a2a33; border-color: #34343c; color: var(--pzds-text); font-weight: 700;
}.pzc-v3 /* ---------- 8. Grille de produits --------------------------- */

.pzc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 0 18px 18px; }.pzc-v3 .pzc-tile {
  height: var(--pzc-tile-h);
  min-height: var(--pzc-touch-money);         /* money-path */
  border-radius: var(--pzds-r-card);
  background: var(--pzc-glass); border: 1px solid var(--pzc-glass-line);
  padding: 14px; text-align: left;
  display: flex; flex-direction: column; justify-content: space-between;
  transition: transform .12s ease, border-color .12s ease;
}.pzc-v3 .pzc-tile:active { transform: scale(.97); }.pzc-v3 .pzc-tile-name { font-weight: 600; font-size: 14.5px; color: var(--pzds-text); line-height: 1.3; }.pzc-v3 .pzc-tile-foot { display: flex; align-items: baseline; justify-content: space-between; }.pzc-v3 .pzc-tile .pzc-money { font-size: 21px; color: var(--pzds-text-strong); }.pzc-v3 .pzc-tile-qty { font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 600; font-size: 11px; color: var(--pzds-text-2); }.pzc-v3 .pzc-tile[data-action] {
  background: none; border: 1px dashed rgba(255,255,255,.14);
  align-items: center; justify-content: center; gap: 8px;
  color: var(--pzds-text-3); font-weight: 600; font-size: 13px;
}.pzc-v3 .pzc-badge {
  font-weight: 700; font-size: 10px; letter-spacing: .5px;
  padding: 3px 8px; border-radius: var(--pzds-r-badge);
  background: rgba(108,76,241,.18); color: var(--pzds-lavender-2);
}.pzc-v3 /* ---------- 9. Panneau ticket ------------------------------- */
/* Colonne indépendante. Le total et le bouton ne défilent JAMAIS. */

.pzc-ticket {
  flex: 0 0 var(--pzc-ticket-w); width: var(--pzc-ticket-w);
  border-left: 1px solid rgba(255,255,255,.09);
  background: var(--pzc-panel);
  display: flex; flex-direction: column; min-height: 0;
}.pzc-v3 .pzc-ticket-head {
  flex: 0 0 auto; padding: 16px 20px 14px;
  border-bottom: 1px solid var(--pzc-glass-line);
  display: flex; align-items: center; justify-content: space-between;
}.pzc-v3 .pzc-ticket-lines { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 12px 14px; }.pzc-v3 .pzc-line {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 12px; margin-bottom: 8px;
  border-radius: var(--pzds-r-card); border: 1px solid rgba(255,255,255,.06);
}.pzc-v3 .pzc-line[aria-selected="true"] { background: var(--pzc-sel-bg); border-color: rgba(108,76,241,.4); padding: 12px; }.pzc-v3 .pzc-line-name { font-weight: 600; font-size: 14.5px; color: var(--pzds-text); }.pzc-v3 .pzc-line-unit { margin-top: 3px; font-size: 12.5px; color: var(--pzds-text-2); }.pzc-v3 /* Colonne fixe. Au-delà de 6 caractères la taille descend, on ne tronque pas. */
.pzc-line-amt { flex: 0 0 78px; width: 78px; text-align: right; font-size: 19px; color: var(--pzds-text); }.pzc-v3 .pzc-line-amt[data-long] { font-size: 16px; }.pzc-v3 .pzc-qty { min-width: 30px; height: 30px; padding: 0 8px; border-radius: 9px;
  background: rgba(255,255,255,.07); display: grid; place-items: center; }.pzc-v3 .pzc-stepper { display: flex; align-items: center; gap: 6px; }.pzc-v3 .pzc-stepper button {
  width: var(--pzc-touch); height: var(--pzc-touch);
  border-radius: var(--pzds-r-field);
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.13);
  color: var(--pzds-text); font-size: 18px;
  display: grid; place-items: center;
}.pzc-v3 .pzc-stepper output { width: 34px; text-align: center; font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 600; font-size: 18px; color: var(--pzds-text-strong); }.pzc-v3 .pzc-ticket-foot {
  flex: 0 0 auto;
  padding: 14px 20px calc(18px + var(--pzc-safe-bottom));
  border-top: 1px solid var(--pzc-glass-line);
  background: var(--pzds-bg);
}.pzc-v3 .pzc-total { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 14px; }.pzc-v3 .pzc-total .pzc-money { font-size: 44px; letter-spacing: -1px; line-height: 1; color: var(--pzds-text-strong); }.pzc-v3 /* ---------- Boutons ---------------------------------------- */

.pzc-btn {
  border: 0; border-radius: var(--pzds-r-card);
  font-family: var(--pzds-font-body); font-weight: 700;
  display: flex; align-items: center; justify-content: center; gap: 12px;
}.pzc-v3 .pzc-btn-pay {
  width: 100%; height: var(--pzc-touch-money);
  background: var(--pzds-accent); color: #fff; font-size: 20px;
  box-shadow: 0 16px 38px -10px rgba(108,76,241,.75);
}.pzc-v3 .pzc-btn-pay:active { transform: translateY(1px); }.pzc-v3 .pzc-btn-ok {
  height: var(--pzc-touch-money);
  background: linear-gradient(135deg,#3fa56f,#5ad19a); color: #08150f; font-size: 20px;
  box-shadow: 0 16px 38px -10px rgba(90,209,154,.5);
}.pzc-v3 .pzc-btn-ghost {
  height: var(--pzc-touch-money);
  background: none; border: 1px solid rgba(255,255,255,.14);
  color: var(--pzds-text-2); font-weight: 600; font-size: 15px;
}.pzc-v3 .pzc-btn-sec {
  height: 56px; border-radius: 12px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.11);
  color: var(--pzds-text); font-weight: 600; font-size: 12px;
  flex-direction: column; gap: 2px;
}.pzc-v3 /* ---------- 10. Modale d'encaissement ---------------------- */

.pzc-scrim {
  position: absolute; inset: 0; z-index: 10;
  background: rgba(6,6,9,.82); backdrop-filter: blur(3px);
  display: grid; place-items: center;
}.pzc-v3 .pzc-modal {
  width: min(1150px, calc(100% - 48px));
  max-height: calc(100% - 40px);
  border-radius: var(--pzds-r-block);
  background: linear-gradient(172deg,#181820,#121218);
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 40px 90px rgba(0,0,0,.7);
  display: flex; overflow: hidden;
}.pzc-v3 .pzc-method {
  height: var(--pzc-touch-money);
  display: flex; align-items: center; gap: 14px; padding: 0 18px;
  border-radius: var(--pzds-r-card);
  background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.1);
  font-weight: 700; font-size: 17px; color: var(--pzds-text);
}.pzc-v3 .pzc-method[aria-selected="true"] {
  background: rgba(108,76,241,.16); border-color: rgba(108,76,241,.55); color: var(--pzds-text-strong);
}.pzc-v3 /* Pavé numérique de l'application. Voir §13 : il remplace le clavier système
   sur TOUS les champs monétaires. */
.pzc-pad { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr; gap: 8px; }.pzc-v3 .pzc-pad button {
  min-height: var(--pzc-touch-money);
  border-radius: 12px;
  background: var(--pzc-key-bg); border: 1px solid var(--pzc-key-line);
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 600; font-size: 24px;
  color: var(--pzds-text);
}.pzc-v3 .pzc-pad button:active { background: rgba(255,255,255,.12); }.pzc-v3 .pzc-pad button[data-del] { background: rgba(224,86,138,.12); border-color: rgba(224,86,138,.32); color: var(--pzds-danger); }.pzc-v3 /* Le rendu de monnaie. 76 px, jamais 110 : $1,019.50 doit tenir sur une ligne. */
.pzc-change {
  flex: 1; border-radius: 20px;
  background: radial-gradient(120% 130% at 50% 0%, rgba(90,209,154,.16), transparent 68%), var(--pzds-bg);
  border: 1px solid rgba(90,209,154,.4);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 24px; text-align: center;
}.pzc-v3 .pzc-change-label {
  font-family: var(--pzds-font-display); font-weight: 800; font-size: 14px;
  letter-spacing: 1.4px; text-transform: uppercase; color: var(--pzds-ok);
}.pzc-v3 .pzc-change .pzc-money { font-size: clamp(38px, 8vw, 76px); letter-spacing: -2px; line-height: 1.05; color: var(--pzds-text-strong); margin: 10px 0 4px; max-width: 100%; overflow-wrap: anywhere; }.pzc-v3 /* ---------- 11. États --------------------------------------- */

.pzc-state {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 32px; gap: 4px;
}.pzc-v3 .pzc-state-icon {
  width: 88px; height: 88px; border-radius: 50%;
  display: grid; place-items: center; margin-bottom: 20px; font-size: 46px;
}.pzc-v3 .pzc-state[data-tone="ok"]      .pzc-state-icon { background: var(--pzds-ok-dim);     border: 1px solid rgba(90,209,154,.4);  color: var(--pzds-ok); }.pzc-v3 .pzc-state[data-tone="warn"]    .pzc-state-icon { background: rgba(255,179,122,.12);  border: 1px solid rgba(255,179,122,.38); color: var(--pzds-warn); }.pzc-v3 .pzc-state[data-tone="danger"]  .pzc-state-icon { background: var(--pzds-danger-dim); border: 1px solid rgba(224,86,138,.4);  color: var(--pzds-danger); }.pzc-v3 .pzc-state h2 { font-family: var(--pzds-font-display); font-weight: 800; font-size: 22px; letter-spacing: -.3px; color: var(--pzds-text-strong); margin: 0; }.pzc-v3 .pzc-state p { font-size: 14px; line-height: 1.65; color: var(--pzds-text-2); max-width: 320px; margin: 12px 0 0; text-wrap: pretty; }.pzc-v3 /* Chargement : squelettes aux dimensions réelles, jamais de rotateur. */
.pzc-skel {
  border-radius: var(--pzds-r-card);
  background: linear-gradient(90deg, rgba(255,255,255,.04) 25%, rgba(255,255,255,.08) 37%, rgba(255,255,255,.04) 63%);
  background-size: 400% 100%;
  animation: pzc-shimmer 1.4s ease infinite;
}
@keyframes pzc-shimmer { 0% { background-position: 100% 50% } 100% { background-position: 0 50% } }

/* ---------- 12. Formats tablette ---------------------------- */
/* Trois formats réels. La densité change, la disposition non. */

/* iPad Pro 11" paysage · 1194 × 834 */
@media (max-width: 1240px) {:root { --pzc-ticket-w: 392px; --pzc-tile-h: 116px; }.pzc-v3 .pzc-grid { grid-template-columns: repeat(3, 1fr); }
}

/* iPad 9 / Android 4:3 · 1024 × 768 */
@media (max-width: 1100px) {:root { --pzc-ticket-w: 344px; --pzc-tile-h: 94px; --pzc-topbar-h: 52px; }.pzc-v3 .pzc-total .pzc-money { font-size: 34px; }.pzc-v3 .pzc-line { padding: 12px 10px; }.pzc-v3 .pzc-line-amt { flex-basis: 62px; width: 62px; font-size: 16.5px; }.pzc-v3 /* La ligne sélectionnée passe sur deux niveaux : nom + montant, puis stepper. */
  .pzc-line[aria-selected="true"] { display: block; }.pzc-v3 .pzc-line[aria-selected="true"] .pzc-stepper { margin-top: 9px; }
}

/* Barre d'état et indicateur d'accueil iOS en plein écran. */
@media (display-mode: fullscreen), (display-mode: standalone) {.pzc-v3 .pzc-shell { padding-top: var(--pzc-safe-top); }
}

/* Le comptoir est en paysage. En portrait on le dit, on ne devine pas. */
@media (orientation: portrait) {.pzc-v3 .pzc-rotate { display: grid; }.pzc-v3 .pzc-shell { display: none; }
}.pzc-v3 .pzc-rotate { display: none; place-items: center; height: 100dvh; text-align: center; padding: 32px; }.pzc-v3 /* ---------- 13. Clavier système ----------------------------- */
/* Règle des deux claviers :
   - champ MONÉTAIRE  → pavé de l'application, inputmode="none", readonly.
                        Il ne lève jamais le clavier système.
   - champ TEXTE      → clavier système (nom du client, libellé, motif d'écart).
   Les deux ne sont jamais à l'écran en même temps.

   Hauteurs mesurées en paysage : 300 px (iPad 9), 353 px (iPad Pro 11"),
   280–320 px (Android). À LIRE, jamais à coder en dur :

     const vv = window.visualViewport;
     vv.addEventListener('resize', () => {
       const kb = Math.max(0, window.innerHeight - vv.height);
       document.documentElement.style.setProperty('--pzc-kb', kb + 'px');
       document.documentElement.toggleAttribute('data-kb', kb > 120);
     });

   window.innerHeight ne bouge pas sur iOS : seul visualViewport est fiable. */

:root { --pzc-kb: 0px; }.pzc-v3 /* Clavier levé : la modale se redocke en haut de la zone restante. */
[data-kb] .pzc-scrim { align-items: start; }.pzc-v3 [data-kb] .pzc-modal {
  margin-top: 10px;
  max-height: calc(100dvh - var(--pzc-kb) - var(--pzc-topbar-h) - 20px);
}.pzc-v3 /* Le pavé de l'application ne sert pas à la saisie de texte : il s'efface. */
[data-kb] .pzc-pad { display: none; }.pzc-v3 [data-kb] .pzc-amount-inline { display: flex; }.pzc-v3 .pzc-amount-inline { display: none; }.pzc-v3 /* Interdit : position:fixed sur la barre d'action · iOS la décale sous le clavier. */
.pzc-modal-actions { position: static; flex: 0 0 auto; display: flex; gap: 10px; padding: 14px 16px 16px; }