/* Les commentaires (Alt+E) habillés pour Calame.
   Le serveur a changé les couleurs et la police de l'outil en variables (--mcc-…) ;
   chaque thème n'est qu'un jeu de valeurs. « Myriad » = l'outil tel qu'il est sur le site.
     data-theme="encre"   sombre, par défaut : l'encre du jeu, le papier pour le texte
     data-theme="papier"  clair : la feuille de l'atelier                                  */

#mcc[data-theme="encre"], #mcc[data-theme="papier"] {
  --mcc-police: "Cormorant Garamond", Georgia, serif;
  --mcc-corps: 1.2;
  --mcc-arrondi: 0.18;
  letter-spacing: 0.01em;
}

#mcc[data-theme="encre"] {
  --mcc-fond: rgba(30, 27, 36, 0.97);
  --mcc-plein: #1e1b24;
  --mcc-creux: #141218;
  --mcc-creux2: #2b2732;
  --mcc-texte: #efe8dc;
  --mcc-texte-rvb: 239, 232, 220;
  --mcc-voile: 239, 232, 220;
  --mcc-fond-rvb: 30, 27, 36;
  --mcc-v: #d9826b;
  --mcc-v2: #b5604a;
  --mcc-accent-rvb: 217, 130, 107;
  --mcc-accent-clair: #f0b9a2;
  --mcc-ambre: #e3c46a;
  --mcc-ambre-rvb: 227, 196, 106;
  --mcc-rose: #c96f8a;
  --mcc-vert: #9cc48a;
  --mcc-vert-rvb: 156, 196, 138;
  --mcc-erreur: #ec9f8c;
  color: #efe8dc;
}

#mcc[data-theme="papier"] {
  --mcc-fond: rgba(247, 243, 235, 0.97);
  --mcc-plein: #f7f3eb;
  --mcc-creux: #e8e1d5;
  --mcc-creux2: #d9d0c2;
  --mcc-texte: #2b2734;
  --mcc-texte-rvb: 43, 39, 52;
  --mcc-voile: 43, 39, 52;
  --mcc-fond-rvb: 247, 243, 235;
  --mcc-v: #b8664f;
  --mcc-v2: #a3543e;
  --mcc-accent-rvb: 184, 102, 79;
  --mcc-accent-clair: #94472f;
  --mcc-ambre: #a87a1f;
  --mcc-ambre-rvb: 168, 122, 31;
  --mcc-rose: #b4506e;
  --mcc-vert: #4d8558;
  --mcc-vert-rvb: 77, 133, 88;
  --mcc-erreur: #a8402e;
  color: #2b2734;
}

/* ——— Ce qui fait « Calame » dans les deux thèmes ——— */
#mcc[data-theme] .mcc-mode,
#mcc[data-theme] .mcc-lab,
#mcc[data-theme] .mcc-clab,
#mcc[data-theme] .mcc-jour { font-weight: 600; letter-spacing: 0.3em; }
#mcc[data-theme] .mcc-ptitre b { font-weight: 300; font-size: 30px; line-height: 1; letter-spacing: 0; }
#mcc[data-theme] .mcc-ptitre em,
#mcc[data-theme] .mcc-qui em,
#mcc[data-theme] .mcc-meta em,
#mcc[data-theme] .mcc-aide,
#mcc[data-theme] .mcc-vide { font-style: italic; }
#mcc[data-theme] .mcc-chemin { font-style: italic; letter-spacing: 0; }
#mcc[data-theme] .mcc-qui b,
#mcc[data-theme] .mcc-compte b { font-weight: 600; }
#mcc[data-theme] .mcc-pin { font-weight: 700; border-width: 1px; }
#mcc[data-theme] .mcc-texte,
#mcc[data-theme] .mcc-ibody i { font-size: 17px; line-height: 1.35; }
#mcc[data-theme] textarea { font-size: 17px; line-height: 1.35; }
/* la boîte de visée : un trait d'encre, pas un néon */
#mcc[data-theme] .mcc-boite { border-width: 1px; box-shadow: 0 0 0 3px rgba(var(--mcc-accent-rvb), 0.14); border-radius: 0; }
#mcc[data-theme] .mcc-etiq { border-radius: 0; letter-spacing: 0.04em; }
/* le tiroir et les bulles : bords francs, filet fin */
#mcc[data-theme] .mcc-panneau { background: var(--mcc-plein); }
#mcc[data-theme] .mcc-barre { padding-left: 16px; }

/* ——— Le papier : du texte sombre là où l'outil mettait du blanc sur du neutre ——— */
#mcc[data-theme="papier"] .mcc-barre,
#mcc[data-theme="papier"] .mcc-bulle,
#mcc[data-theme="papier"] .mcc-carte,
#mcc[data-theme="papier"] .mcc-panneau,
#mcc[data-theme="papier"] .mcc-ping,
#mcc[data-theme="papier"] .mcc-arob,
#mcc[data-theme="papier"] .mcc-eclair { box-shadow: 0 14px 36px rgba(43, 39, 52, 0.16), 0 0 0 1px rgba(43, 39, 52, 0.06); }
#mcc[data-theme="papier"] .mcc-pfermer:hover,
#mcc[data-theme="papier"] .mcc-onglets button.on,
#mcc[data-theme="papier"] .mcc-ceff:hover,
#mcc[data-theme="papier"] .mcc-arobc.on b,
#mcc[data-theme="papier"] .mcc-pmasquer:hover,
#mcc[data-theme="papier"] .mcc-dret:hover,
#mcc[data-theme="papier"] .mcc-dic:hover,
#mcc[data-theme="papier"] .mcc-tong.on,
#mcc[data-theme="papier"] .mcc-tplus:hover,
#mcc[data-theme="papier"] .mcc-tic:hover,
#mcc[data-theme="papier"] .mcc-tfb:hover,
#mcc[data-theme="papier"] .mcc-apremettre:hover { color: #1d1a22; }
#mcc[data-theme="papier"] .mcc-loupe { background: rgba(243, 238, 229, 0.92); }
#mcc[data-theme="papier"] .mcc-teinte.on { box-shadow: 0 0 0 2px #f7f3eb, 0 0 0 3.5px #2b2734; }

/* ——— Le choix du thème, dans la barre du mode ——— */
#mcc .mcc-calame-theme {
  display: flex; align-items: center; gap: 7px;
  height: 28px; padding: 0 11px; border: 0; cursor: pointer;
  border-radius: calc(14px * var(--mcc-arrondi, 1));
  background: rgba(var(--mcc-voile, 255, 255, 255), 0.06);
  font-size: calc(11px * var(--mcc-corps, 1)); letter-spacing: 0.04em;
  transition: background 0.15s;
}
#mcc .mcc-calame-theme:hover { background: rgba(var(--mcc-voile, 255, 255, 255), 0.12); }
#mcc .mcc-calame-theme i {
  width: 11px; height: 11px; border-radius: 50%;
  background: linear-gradient(90deg, #1e1b24 50%, #f3eee5 50%);
  box-shadow: 0 0 0 1px rgba(var(--mcc-voile, 255, 255, 255), 0.35);
}

/* ——— Les cibles posées sur le canevas du jeu pendant le mode ——— */
.calame-cibles { position: fixed; inset: 0; z-index: 3; pointer-events: none; }
.calame-cibles > div { position: fixed; pointer-events: none; }

/* les discussions ont leurs toiles et leur checklist (api/toiles.php) */
#mcc .mcc-calame-pseudo { font-style: italic; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }