/* CVG-PATCH745 (Maxou, 04.11.2026) : note explicative du moyen dans les portraits de groupe (ap-note-moyen.js), sans action de plus
   pour le visiteur.
   ORDINATEUR : LE CALQUE, pose au-dessus du titre de la case du moyen (23 DESSIN) dans l'aile des moyens quand l'artiste est
   selectionne (variante : sur le mot de la description courte). Par defaut blanc sur gris sombre (.ap-note-sombre, plus bas) ; le
   clair ci-dessous reste la variante. Rattache au body, place en position fixe par ap-note-moyen.js (hors du tableau reduit par transform : le texte garde sa
   taille), au-dessus du mot, fleche sur lui (dessous si le mot est en haut de l'aile). Fond #fffefb, filet 1px #d2d0ca, IBM Plex Mono ;
   apparition en fondu.
   Corps : celui de la description courte A L'ECRAN, pose en ligne par le script (Maxou : "taille de police identique" ; 9,35 px a
   1280 px de large, 14 px a 1920, interligne de la description). Largeur, marges et fleche en em : 21,67 em = 260 px a 12 px, les
   coupures de ligne sont les memes a toute largeur d'ecran. */
.ap-note-calque {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 2147483000;
    box-sizing: content-box;
    width: 21.67em;
    max-width: calc(100vw - 42px);
    margin: 0;
    padding: .75em 1em .83em;
    background: #fffefb;
    border: 1px solid #d2d0ca;
    border-radius: 0;
    box-shadow: none;
    color: #33302a;
    font-family: "IBM Plex Mono", ui-monospace, "Courier New", monospace;
    font-size: 12px;
    font-weight: 400;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0;
    text-align: left;
    text-transform: none;
    white-space: normal;
    overflow-wrap: break-word;
    cursor: default;
    opacity: 0;
    transition: opacity .25s ease-out;
}
.ap-note-calque.ap-note-vu {
    opacity: 1;
}
.ap-note-calque[hidden] {
    display: none !important;
}
/* la fleche : un carre tourne, filet sur les deux cotes exterieurs, pose sur le bord vers le mot */
.ap-note-calque::after {
    content: "";
    position: absolute;
    left: var(--ap-note-fleche, 50%);
    bottom: -.5em;
    width: .83em;
    height: .83em;
    margin-left: -.5em;
    box-sizing: border-box;
    background: #fffefb;
    border-right: 1px solid #d2d0ca;
    border-bottom: 1px solid #d2d0ca;
    transform: rotate(45deg);
}
.ap-note-calque.ap-note-dessous::after {
    bottom: auto;
    top: -.5em;
    border: 0;
    border-left: 1px solid #d2d0ca;
    border-top: 1px solid #d2d0ca;
}
/* variante sombre : blanc sur le gris sombre des pilules du site (722 « Visitez sa page », #33302a), sans filet */
.ap-note-calque.ap-note-sombre {
    background: #33302a;
    border-color: #33302a;
    color: #fff;
}
.ap-note-calque.ap-note-sombre::after {
    background: #33302a;
    border-color: #33302a;
}

/* TELEPHONE (mode rouleaux) : la note sur une ligne a elle, sous "MOYEN 23 · ... › DESSIN" de la ligne ouverte. Selecteur par
   #ap-rouleaux : ap-rouleaux.css remet a zero tout div sous cet identifiant (marges, police, couleur). */
#ap-rouleaux .apr-art-o .ap-note-ligne {
    margin: calc(-1 * var(--u, 1px)) 0 0;
    font-family: "IBM Plex Mono", ui-monospace, monospace;
    font-size: calc(10 * var(--u, 1px));
    line-height: calc(14 * var(--u, 1px));
    letter-spacing: 0;
    text-transform: none;
    white-space: normal;            /* la liste des rouleaux est en nowrap : la note passe a la ligne */
    overflow-wrap: break-word;
    color: #6b6862;
}