/* HORA, L AGENDA. 2026-09-26. Aucune couleur en dur hors celles des calendriers :
   tout le reste prend les jetons du theme, donc les sept themes suivent. */

/* Le rail : une pastille de la couleur du calendrier, eteinte quand il est masque. */
.pastille-agenda {
  display: inline-block; width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto;
  background: var(--c); margin-right: 2px; vertical-align: 1px;
}
.lien-agenda { gap: 10px; }
.lien-agenda.masque { color: var(--encre-4); }
.lien-agenda.masque .pastille-agenda { background: transparent; box-shadow: inset 0 0 0 1.5px var(--c); }

.menu-couleurs .nuancier { display: grid; grid-template-columns: repeat(5, 30px); gap: 6px; padding: 6px 10px 8px; }
.menu-couleurs .nuance {
  width: 30px; height: 30px; min-height: 0; padding: 0; border-radius: 50%;
  background: var(--c); border: 2px solid transparent; cursor: pointer;
}
.menu-couleurs .nuance:hover { border-color: var(--encre); background: var(--c); }

/* La barre du calendrier : naviguer a gauche, choisir la vue a droite. */
.barre-cal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 6px 0 22px; }
.nav-cal, .choix-cal { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; }
.nav-cal button.nu, .choix-cal button.nu { min-height: 40px; }
.choix-cal button[aria-pressed="true"] { color: var(--encre); background: var(--voile); }
.choix-cal button.nu.plein { margin-left: 8px; }
.periode-cal {
  font-family: var(--lecture); font-size: 20px; color: var(--encre); margin-left: 10px;
  text-transform: none; letter-spacing: 0;
}
.periode-cal::first-letter { text-transform: uppercase; }

/* ── Le mois ─────────────────────────────────────────────────────────── */
.grille-mois {
  display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
  /* Les six semaines se partagent la hauteur de l ecran : `--rang` est pose par `mesureMois()`. */
  grid-template-rows: auto repeat(6, var(--rang, auto));
  border-top: 1px solid var(--filet-2); border-left: 1px solid var(--filet-2);
}
.grille-mois .tete-jour {
  font-family: var(--chiffre); font-size: 13px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--encre-4); padding: 8px 8px 6px; border-right: 1px solid var(--filet-2); border-bottom: 1px solid var(--filet-2);
}
.case-jour {
  min-width: 0; min-height: 112px; padding: 6px 6px 8px; cursor: pointer; position: relative;
  border-right: 1px solid var(--filet-2); border-bottom: 1px solid var(--filet-2);
  display: flex; flex-direction: column; gap: 3px; transition: background .14s ease;
}
.case-jour:hover { background: var(--voile); }
.case-jour.hors .num-jour { color: var(--encre-4); }
.num-jour { font-family: var(--chiffre); font-size: 14px; color: var(--encre-2); align-self: flex-start;
  min-width: 24px; height: 24px; line-height: 24px; text-align: center; border-radius: 12px; }
.case-jour.auj .num-jour { background: var(--encre); color: var(--fond); }
.puce-rdv {
  display: flex; gap: 6px; align-items: baseline; width: 100%; min-width: 0;
  border: 0; background: none; color: var(--encre); cursor: pointer; text-align: left;
  font: inherit; font-size: 13.5px; line-height: 1.35; padding: 2px 6px; border-radius: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  box-shadow: inset 3px 0 0 var(--c);
}
.puce-rdv .h { font-family: var(--chiffre); font-size: 12.5px; color: var(--encre-3); flex: 0 0 auto; }
.puce-rdv:hover { background: var(--voile); }
.puce-rdv.pleine { background: var(--c); color: var(--t, #16130d); box-shadow: none; font-weight: 500; }
.puce-rdv.pleine:hover { background: var(--c); filter: brightness(1.08); }
/* LES BANDES CONTINUES : une ligne de hauteur fixe, un creux de meme hauteur la ou elle ne passe
   pas, les bouts coupes a plat, et la bande colle a la case voisine par-dessus le filet. */
.case-jour { --pg: 6px; --pd: 7px; }
.col-journee { --pg: 4px; --pd: 3px; }
.puce-rdv.seg, .vide-seg { flex: 0 0 22px; height: 22px; box-sizing: border-box; }
.vide-seg { display: block; }
.puce-rdv.seg { width: auto; align-self: stretch; overflow: visible; position: relative; z-index: 1; padding: 2px 6px; }
.puce-rdv.seg.tete-seg { z-index: 2; }
.puce-rdv.seg .t { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: calc(var(--span, 1) * 100% + (var(--span, 1) - 1) * 13px); }
.puce-rdv.seg.coupe-g { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.puce-rdv.seg.coupe-d { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.puce-rdv.seg.colle-g { margin-left: calc(-1 * var(--pg)); padding-left: calc(6px + var(--pg)); }
.puce-rdv.seg.colle-d { margin-right: calc(-1 * var(--pd)); }
.plus-rdv { font-family: var(--chiffre); font-size: 12.5px; color: var(--encre-3); padding: 0 6px; }
.points-rdv { display: none; }

/* ── La semaine et le jour ───────────────────────────────────────────── */
.temps { --h: 48px; border: 1px solid var(--filet-2); border-radius: 8px; overflow: hidden; }
.rang-tetes, .rang-journee { display: grid; grid-template-columns: 52px repeat(var(--n), minmax(0, 1fr)); }
.rang-tetes { border-bottom: 1px solid var(--filet-2); }
.tete-col { padding: 8px 6px; text-align: center; cursor: pointer; border-left: 1px solid var(--filet-2); }
.tete-col span { display: block; font-family: var(--chiffre); font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--encre-4); }
.tete-col b { font-family: var(--chiffre); font-weight: 400; font-size: 19px; color: var(--encre-2); }
.tete-col.auj b { color: var(--fond); background: var(--encre); border-radius: 14px; padding: 0 8px; }
.rang-journee { border-bottom: 1px solid var(--filet-2); min-height: 8px; }
.col-journee { border-left: 1px solid var(--filet-2); padding: 3px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.grille-heures { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr); height: min(66vh, 720px); overflow-y: auto; }
.heures { position: relative; }
.heure-lib { position: absolute; right: 8px; transform: translateY(-50%); font-family: var(--chiffre); font-size: 12px; color: var(--encre-4); }
.cols { position: relative; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr));
  background-image: linear-gradient(var(--filet-2) 1px, transparent 1px); background-size: 100% var(--h); }
.col-jour { position: relative; border-left: 1px solid var(--filet-2); cursor: pointer; }
.bloc-rdv {
  position: absolute; box-sizing: border-box; overflow: hidden; text-align: left; cursor: pointer;
  border: 0; border-left: 3px solid var(--c); border-radius: 5px; padding: 3px 6px;
  background: color-mix(in srgb, var(--c) 22%, var(--fond-carte)); color: var(--encre); font: inherit;
  box-shadow: 0 0 0 1px var(--fond);
}
.bloc-rdv b { display: block; font-weight: 500; font-size: 13.5px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bloc-rdv span { display: block; font-family: var(--chiffre); font-size: 12px; color: var(--encre-3); }
.bloc-rdv:hover { background: color-mix(in srgb, var(--c) 34%, var(--fond-carte)); }
.maintenant { position: absolute; left: 0; right: 0; height: 2px; background: var(--encre); pointer-events: none; }
/* ETIRER (2026-09-27, comme Google Agenda) : une bande de prise en bas du bloc, un trait qui
   apparait au survol, le curseur « haut-bas ». Au doigt, la prise est plus haute et toujours visible. */
.etirer-rdv { position: absolute; left: 0; right: 0; bottom: 0; height: 9px; cursor: ns-resize; touch-action: none; }
.etirer-rdv::after { content: ""; position: absolute; left: 50%; bottom: 2px; width: 18px; height: 3px; margin-left: -9px;
  border-radius: 2px; background: var(--encre-3); opacity: 0; transition: opacity .15s ease; }
.etirer-rdv.haut { top: 0; bottom: auto; height: 7px; }
.etirer-rdv.haut::after { top: 2px; bottom: auto; }
.bloc-rdv:hover .etirer-rdv::after, .bloc-rdv.etire .etirer-rdv::after { opacity: 1; }
.bloc-rdv.etire { z-index: 5; box-shadow: 0 0 0 1px var(--fond), 0 8px 20px rgba(0,0,0,.35); }
body.en-etirement, body.en-etirement * { cursor: ns-resize !important; -webkit-user-select: none; user-select: none; }
@media (hover: none) { .etirer-rdv { height: 16px; } .etirer-rdv.haut { height: 12px; } .etirer-rdv::after { opacity: .7; } }
.maintenant::before { content: ''; position: absolute; left: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--encre); }

/* ── La liste a venir ────────────────────────────────────────────────── */
.carte-rdv h3 { display: flex; align-items: center; gap: 10px; }
.carte-rdv .pastille-agenda { width: 10px; height: 10px; }

/* ── La fenetre d un rendez-vous ─────────────────────────────────────── */
.pupitre-rdv { width: min(720px, calc(100vw - 24px)); height: auto; max-height: 90vh; padding: 30px 30px 20px; }
.pupitre-rdv .corps-rdv { overflow-y: auto; flex: 1 1 auto; min-height: 0; margin-top: 12px; }
.champs-rdv { display: grid; grid-template-columns: minmax(0, 140px) minmax(0, 1fr); gap: 12px 16px; align-items: center; }
.champs-rdv > label { color: var(--encre-3); font-size: 15px; }
.champs-rdv input:not([type="checkbox"]), .champs-rdv select, .champs-rdv textarea {
  min-width: 0; max-width: 100%; box-sizing: border-box;
  background: var(--fond-haut); box-shadow: var(--creux); color: var(--encre);
  border: 1px solid var(--carte-filet); border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 16px;
}
.champs-rdv textarea { width: 100%; resize: vertical; font-family: var(--lecture); }
.champs-rdv #rdvLieu, .champs-rdv #rdvFuseau, .champs-rdv select#rdvPreset, .champs-rdv select#rdvAgenda { width: 100%; }
.champs-rdv input:focus, .champs-rdv select:focus, .champs-rdv textarea:focus { outline: none; border-color: var(--encre-3); }
.champs-rdv input[type="checkbox"] { width: 22px; height: 22px; accent-color: var(--encre); }
.rang-date { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; color: var(--encre-3); }
.rang-date input[type="number"] { width: 84px; }
.valeur-rdv { display: inline-flex; align-items: center; gap: 8px; }
.compositeur { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-radius: 10px; background: var(--voile); }
.jours-rdv { display: flex; gap: 4px; flex-wrap: wrap; }
.jours-rdv button.nu { min-width: 44px; min-height: 44px; }
.jours-rdv button[aria-pressed="true"] { color: var(--fond); background: var(--encre); }
.regle-brute { font-family: var(--chiffre) !important; font-size: 14px !important; width: 100%; }
.rang-rappel { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px; color: var(--encre-3); }
.rang-rappel input[type="number"] { width: 80px; }
#gaucheRdv:empty { display: none; }

/* ── Le telephone ────────────────────────────────────────────────────── */
@media (max-width: 700px) {
  .case-jour { min-height: 58px; padding: 4px 2px 6px; align-items: center; }
  .case-jour .puce-rdv, .case-jour .plus-rdv, .case-jour .vide-seg { display: none; }
  .points-rdv { display: flex; gap: 3px; flex-wrap: wrap; justify-content: center; }
  .points-rdv i { width: 6px; height: 6px; border-radius: 50%; background: var(--c); }
  .num-jour { align-self: center; }
  .grille-mois .tete-jour { padding: 6px 2px; text-align: center; font-size: 12px; letter-spacing: .02em; }
  .rang-tetes, .rang-journee, .grille-heures { grid-template-columns: 40px repeat(var(--n), minmax(0, 1fr)); }
  .grille-heures { grid-template-columns: 40px minmax(0, 1fr); }
  .tete-col b { font-size: 16px; }
  /* Cinq signes mono dans 40 px : on serre, sinon « 08:00 » perd son premier chiffre. */
  .heure-lib { right: 3px; font-size: 10px; letter-spacing: -.02em; }
  .bloc-rdv b { font-size: 12.5px; }
  .bloc-rdv span { display: none; }
  .periode-cal { font-size: 17px; margin-left: 4px; }
  .choix-cal button.nu.plein { margin-left: 0; }
  .pupitre-rdv { padding: 20px 14px 14px; max-height: 94vh; }
  .champs-rdv { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .champs-rdv > label { margin-top: 8px; }
  .champs-rdv > label:empty { display: none; }
}
@media (hover: hover) and (pointer: fine) { .case-jour:hover .num-jour:not(.auj) { color: var(--encre); } }

/* LA MESURE DE LECTURE NE VAUT PAS POUR UN CALENDRIER. La scene borne ses enfants
   a une colonne de prose ; une grille de sept jours a besoin de toute la largeur. */
#scene > .cal { max-width: none; width: 100%; }
/* LE MOIS DESCEND JUSQU EN BAS : la marge de fin de page (120 px) le repoussait sous l ecran. */
section.scene:has(.grille-mois) { padding-bottom: 24px; }
@media (min-width: 701px) {
  /* LES BANDES CONTINUES LISENT CE PADDING : `--pg` = padding gauche, `--pd` = padding droit + le
     filet. Changer l un sans l autre coupe chaque sejour en morceaux (regression du 2026-09-27,
     vue par Anthony le soir meme). */
  .case-jour { padding: 8px 8px 10px; gap: 4px; --pg: 8px; --pd: 9px; }
}

.dedans-large { max-width: none !important; }

/* LE VRAI TELEPHONE, 360 a 412 px. Vera l a exige le 2026-09-26 : le palier de 700 px
   est une tablette etroite, et un telephone n y trouvait pas ses cibles de 44 px. */
@media (max-width: 480px) {
  .nav-cal button.nu, .choix-cal button.nu { min-height: 44px; min-width: 44px; }
  .choix-cal { width: 100%; }
  .choix-cal button.nu.plein { flex: 1 1 100%; margin-top: 4px; }
  .menu-couleurs .nuancier { grid-template-columns: repeat(5, 44px); }
  .menu-couleurs .nuance { width: 44px; height: 44px; }
  .rang-tetes, .rang-journee { grid-template-columns: 44px repeat(var(--n), minmax(0, 1fr)); }
  .grille-heures { grid-template-columns: 44px minmax(0, 1fr); }
  .heure-lib { right: 4px; font-size: 11px; letter-spacing: 0; }
  .case-jour { min-height: 52px; }
  .rang-rappel select, .rang-rappel input { min-height: 44px; }
  .champs-rdv input[type="checkbox"] { width: 28px; height: 28px; }
}

/* La fleche de « Calendrier » : la meme que devant « Mes espaces », mais separee du
   mot, parce qu ici le mot OUVRE le calendrier et la fleche seule replie la liste. */
.titre-pli-cal { display: inline-flex; align-items: center; gap: 4px; }
.pli-cal { border: 0; background: none; color: inherit; cursor: pointer; padding: 0; min-width: 24px; min-height: 32px;
  display: inline-flex; align-items: center; justify-content: center; border-radius: 3px; }
.pli-cal:hover { color: var(--encre); background: var(--voile); }
.pli-cal .pli { display: inline-block; width: 10px; text-align: center; transition: transform .16s ease; }
.pli-cal .pli.tourne { transform: rotate(90deg); }

/* Le choix du fuseau, dans Parametres : meme matiere que les champs voisins. */
.choix-fuseau { flex: 1 1 220px; min-width: 0; min-height: 44px; background: var(--fond-haut); box-shadow: var(--creux);
  color: var(--encre); border: 1px solid var(--carte-filet); border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 16px; }

/* ── Les anniversaires, 2026-09-26 ───────────────────────────────────── */
.nav-cal.sans-nav > button { display: none; }
.nav-cal.sans-nav .periode-cal { margin-left: 0; }
.tete-anniv { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.tete-anniv .intro { margin: 0; }
.mois-anniv .etiquette { margin-top: 34px; }
.mois-anniv .etiquette > :first-child::first-letter { text-transform: uppercase; }
.carte-anniv { display: flex; gap: 20px; align-items: flex-start; }
.jour-anniv { flex: 0 0 52px; display: flex; flex-direction: column; align-items: center; line-height: 1.1;
  padding: 6px 0; border-radius: 10px; background: color-mix(in srgb, #e58fc2 16%, transparent); }
.jour-anniv b { font-family: var(--lecture); font-weight: 400; font-size: 26px; color: var(--encre); }
.jour-anniv span { font-family: var(--chiffre); font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); }
.corps-anniv { min-width: 0; flex: 1 1 auto; }
.corps-anniv .meta { margin-top: 6px; }
.corps-anniv .resume { -webkit-line-clamp: 3; font-style: italic; }
.carte-anniv.passe { opacity: .5; }
.carte-anniv.jour-j .jour-anniv { background: #e58fc2; }
.carte-anniv.jour-j .jour-anniv b, .carte-anniv.jour-j .jour-anniv span { color: #1b1b1b; }
.bouton-anniv[aria-pressed="true"] { color: var(--encre); background: var(--voile); }
/* L interrupteur d un calendrier au rail : le meme que celui d un espace. */
.lien-agenda .sortie-bascule { margin-left: 6px; }
@media (max-width: 480px) { .jour-anniv { flex-basis: 46px; } .jour-anniv b { font-size: 22px; } .carte-anniv { gap: 14px; } }

/* ── Les connecteurs, dans Parametres, 2026-09-26 ────────────────────── */
.sous-titre-param { margin: 22px 0 8px; font-family: var(--chiffre); font-size: 13px; font-weight: 400;
  letter-spacing: .08em; text-transform: uppercase; color: var(--encre-4); }
.connecteur { padding: 14px 0; border-bottom: 1px solid var(--filet-2); }
.connecteur:last-child { border-bottom: 0; }
.connecteur-tete { display: flex; align-items: baseline; gap: 10px; }
.connecteur-tete b { font-family: var(--lecture); font-weight: 400; font-size: 18px; color: var(--encre); }
.connecteur-tete span { font-family: var(--chiffre); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--encre-4); }
.connecteur .note-param { margin-top: 6px; }

/* Le « + » d un anniversaire, a cote du mot : meme geste que le « + » des calendriers. */
.plus-anniv { border: 0; background: none; color: var(--encre-3); cursor: pointer; vertical-align: 2px;
  margin-left: 6px; min-width: 32px; min-height: 32px; border-radius: 6px; }
.plus-anniv:hover { color: var(--encre); background: var(--voile); }
@media (max-width: 480px) { .plus-anniv { min-width: 44px; min-height: 44px; } }

/* ── Les connecteurs, facon Claude, 2026-09-26 ───────────────────────── */
.barre-cx { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 4px 0 14px; }
.onglets-cx { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--voile); }
.onglets-cx button.nu { min-height: 34px; text-transform: none; letter-spacing: 0; font-family: inherit; font-size: 14px; }
.onglets-cx button[aria-selected="true"] { background: var(--fond-carte); color: var(--encre); }
.barre-cx input { flex: 1 1 180px; min-width: 0; min-height: 40px; background: var(--fond-haut); box-shadow: var(--creux);
  color: var(--encre); border: 1px solid var(--carte-filet); border-radius: 10px; padding: 8px 12px; font: inherit; font-size: 16px; }
.table-cx { display: grid; }
.rang-cx { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) 44px auto; gap: 10px; align-items: center;
  padding: 11px 0; border-bottom: 1px solid var(--filet-2); }
.rang-cx.tete { font-family: var(--chiffre); font-size: 12.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--encre-4); padding-top: 0; }
.nom-cx { display: flex; align-items: center; gap: 10px; min-width: 0; color: var(--encre); }
.statut-cx, .fait-cx { color: var(--encre-2); text-align: center; }
.logo-cx { flex: 0 0 auto; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px;
  background: color-mix(in srgb, var(--c) 22%, var(--fond-carte)); color: var(--c); font-family: var(--lecture); font-size: 16px; }
/* ASSISTANTS ET SOURCES : un titre court, l icone dit le sens (entrer dans Hora, en sortir). */
.titre-cx { display: flex; align-items: center; gap: 8px; margin: 18px 0 10px; font-family: var(--chiffre); font-size: 12.5px;
  font-weight: 500; letter-spacing: .07em; text-transform: uppercase; color: var(--encre-3); }
.titre-cx svg { flex: 0 0 auto; }
.grille-cx { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 10px; }
.carte-cx { position: relative; display: flex; gap: 12px; align-items: flex-start; padding: 14px 44px 14px 14px;
  border: 1px solid var(--carte-filet); border-radius: 12px; background: var(--fond-carte); min-width: 0; }
.carte-cx .logo-cx { width: 38px; height: 38px; font-size: 19px; border-radius: 10px; }
/* LES VRAIS LOGOS : une tuile neutre (--voile, jamais --fond-haut : identique a la carte sur
   les themes en relief), le logo a 64 % ; OpenAI en masque pour suivre l encre du theme. */
.logo-cx.vrai-cx { position: relative; background: var(--voile); border: 1px solid var(--carte-filet); }
.vrai-cx img, .vrai-cx .masque-cx { width: 64%; height: 64%; object-fit: contain; display: block; }
.vrai-cx .masque-cx { background: var(--encre); -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.badge-cx { position: absolute; right: -4px; bottom: -4px; width: 16px; height: 16px; border-radius: 5px; display: grid; place-items: center;
  background: var(--encre); color: var(--fond); box-shadow: 0 0 0 2px var(--fond-carte); }
.carte-cx .badge-cx { width: 18px; height: 18px; }
.texte-cx { min-width: 0; }
.texte-cx b { display: block; color: var(--encre); font-weight: 500; }
.texte-cx p { margin: 4px 0 6px; color: var(--encre-3); font-size: 14px; line-height: 1.45; }
.texte-cx span { font-size: 13px; color: var(--encre-4); }
.plus-cx, .fait-cx { position: absolute; top: 12px; right: 10px; width: 30px; height: 30px; border-radius: 8px;
  display: grid; place-items: center; border: 1px solid var(--carte-filet); background: var(--voile); color: var(--encre); font-size: 18px; cursor: pointer; }
.fait-cx { cursor: default; background: color-mix(in srgb, #7dd3a8 25%, transparent); border-color: transparent; }
.plus-cx:hover { background: var(--encre); color: var(--fond); }
@media (max-width: 480px) { .rang-cx { grid-template-columns: minmax(0, 1fr) 30px auto; } .rang-cx > .quand, .rang-cx.tete > :nth-child(2) { display: none; }
  .plus-cx { width: 44px; height: 44px; top: 8px; right: 6px; } .carte-cx { padding-right: 56px; } }

/* L ICONE ANNIVERSAIRES DU RAIL (2026-09-26) : pale quand ils sont caches, rose quand ils se voient. */
.anniv-rail { opacity: .55; }
.anniv-rail[aria-pressed="true"] { opacity: 1; color: #e58fc2; }

/* GLISSER-DEPOSER UN RENDEZ-VOUS, 2026-09-26. La poignee ne selectionne pas de texte et
   n ouvre pas le menu du doigt ; la source s estompe, la case visee s eclaire. */
[data-occ] { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
@media (hover: hover) and (pointer: fine) { [data-occ] { cursor: grab; } }
.glisse-source { opacity: .35; }
.fantome-rdv { position: fixed; z-index: 90; pointer-events: none; margin: 0; opacity: .92;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .28); transform: rotate(-1deg); }
body.en-glisse, body.en-glisse * { cursor: grabbing !important; -webkit-user-select: none; user-select: none; }
.case-jour.cible-glisse, .col-journee.cible-glisse, .col-jour.cible-glisse {
  background: color-mix(in srgb, var(--encre) 8%, transparent); outline: 1px dashed var(--encre-3); outline-offset: -2px; }
.menu .note-menu { margin: 4px 12px 8px; font-size: 13px; color: var(--encre-3); max-width: 260px; }

/* « AUSSI DANS », 2026-09-26 : un reflet se reconnait a son filet pointille ; la fenetre
   liste ses calendriers en puces. */
.reflet { outline: 1px dashed color-mix(in srgb, var(--c, var(--encre-3)) 80%, var(--encre)); outline-offset: -1px; }
.aussi-rdv { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 0; }
.puce-aussi { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 9px; border-radius: 999px;
  background: var(--voile); font-size: 14px; max-width: 100%; min-width: 0; }
.puce-aussi button { min-width: 28px; min-height: 28px; padding: 0; line-height: 1; }
.aussi-rdv select { max-width: 100%; min-width: 0; }