/* ============================================================
   Recto d'une carte de profil au style « krosmoz » (cartes 4.x), version web : rendu de js/modules/carte-recto.js,
   repris de KrosCarte (style.css : #carte_recto, .sort_container…). La carte garde les mesures de la carte HD
   (744 × 1040 px) et s'affiche réduite par transform (.carte-recto-cadre) ; l'image web fait 400 px de large.
   Polices libres proches de celles de KrosCarte : TeX Gyre Heros Cn (Helvetica Neue condensée), TeX Gyre Heros Bold
   (Helvetica Neue Bold / Medium), Roboto Light (Helvetica Neue Light), Mitr SemiBold (Berlin Sans FB Demi). Couleurs en dur, identiques dans les deux thèmes (rien dans
   theme-sombre.css) : c'est une image.
   ============================================================ */

@font-face {
    font-family: 'Carte Roboto';
    font-style: normal;
    font-weight: 100 900;
    font-display: block;
    src: url(../../fonts/carte-roboto-latin-ext-normal.woff2) format('woff2');
    unicode-range:
        U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F,
        U+A720-A7FF;
}

@font-face {
    font-family: 'Carte Roboto';
    font-style: normal;
    font-weight: 100 900;
    font-display: block;
    src: url(../../fonts/carte-roboto-latin-normal.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Carte Roboto';
    font-style: italic;
    font-weight: 100 900;
    font-display: block;
    src: url(../../fonts/carte-roboto-latin-ext-italic.woff2) format('woff2');
    unicode-range:
        U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F,
        U+A720-A7FF;
}

@font-face {
    font-family: 'Carte Roboto';
    font-style: italic;
    font-weight: 100 900;
    font-display: block;
    src: url(../../fonts/carte-roboto-latin-italic.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Carte Heros Cn';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url(../../fonts/carte-heroscn-regular.woff2) format('woff2');
}

@font-face {
    font-family: 'Carte Heros Cn';
    font-style: normal;
    font-weight: 700;
    font-display: block;
    src: url(../../fonts/carte-heroscn-bold.woff2) format('woff2');
}

@font-face {
    font-family: 'Carte Heros Cn';
    font-style: italic;
    font-weight: 400;
    font-display: block;
    src: url(../../fonts/carte-heroscn-italic.woff2) format('woff2');
}

@font-face {
    font-family: 'Carte Heros Cn';
    font-style: italic;
    font-weight: 700;
    font-display: block;
    src: url(../../fonts/carte-heroscn-bolditalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Carte Heros';
    font-style: normal;
    font-weight: 700;
    font-display: block;
    src: url(../../fonts/carte-heros-bold.woff2) format('woff2');
}

@font-face {
    font-family: 'Carte Heros';
    font-style: italic;
    font-weight: 700;
    font-display: block;
    src: url(../../fonts/carte-heros-bolditalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Carte Mitr';
    font-style: normal;
    font-weight: 600;
    font-display: block;
    src: url(../../fonts/carte-mitr-latin-ext.woff2) format('woff2');
    unicode-range:
        U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F,
        U+A720-A7FF;
}

@font-face {
    font-family: 'Carte Mitr';
    font-style: normal;
    font-weight: 600;
    font-display: block;
    src: url(../../fonts/carte-mitr-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Cadre d'affichage : la carte (744 × 1040) réduite à la largeur du cadre (--echelle posée par le JS) */
.carte-recto-cadre {
    --echelle: 0.5376;
    position: relative;
    width: calc(744px * var(--echelle));
    height: calc(1040px * var(--echelle));
    overflow: hidden;
    border-radius: calc(30px * var(--echelle));
}

.carte-recto-cadre > .carte-recto {
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(var(--echelle));
    transform-origin: 0 0;
}

.carte-recto {
    --cr-condense: 'Carte Heros Cn', 'Arial Narrow', sans-serif;
    --cr-fort: 'Carte Heros', Helvetica, Arial, sans-serif;
    --cr-texte: 'Carte Roboto', Roboto, Arial, sans-serif;
    --cr-titre: 'Carte Mitr', 'Berlin Sans FB Demi', 'Arial Black', sans-serif;
    position: relative;
    width: 744px;
    height: 1040px;
    overflow: hidden;
    color: #000;
    font-family: var(--cr-texte);
    text-align: left;
    background-color: #000;
    user-select: none;
    -webkit-font-smoothing: antialiased;
}

.carte-recto *,
.carte-recto *::before,
.carte-recto *::after {
    box-sizing: content-box;
}

.carte-recto img {
    max-width: none;
}

.carte-recto .cr-cadre {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: url(../../images/carte/recto/cadre.webp) 0 0 / contain no-repeat;
    pointer-events: none;
}

.carte-recto .cr-fond {
    position: absolute;
    top: 24px;
    left: 24px;
    width: 696px;
    height: 992px;
    background: url(../../images/carte/recto/fond-krosmoz.webp) 0 0 / 696px 992px no-repeat;
}

/* Mention du site dans le bandeau noir du bas (version web) : doré, centré à 15,8 px du bas */
.carte-recto .cr-mention {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 3px;
    z-index: 3;
    height: 26px;
    color: #d9b864;
    font-family: var(--cr-texte);
    font-size: 19px;
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0.24em;
    text-align: center;
    text-indent: 0.24em;
    white-space: nowrap;
}

/* Icônes de fond des stats (8 px plus bas que KrosCarte : plus d'air sous l'initiative) */
.carte-recto .cr-fond-icone {
    position: absolute;
    z-index: 5;
    filter: drop-shadow(2px 2px 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(-2px -2px 2px #fff);
}

.carte-recto .cr-fond-PA {
    top: 157px;
    left: 296px;
    width: 133px;
}

.carte-recto .cr-fond-PM {
    top: 152px;
    left: 9px;
    width: 133px;
}

.carte-recto .cr-fond-PV {
    top: 160px;
    left: 151px;
    width: 133px;
}

.carte-recto .cr-fond-initiative {
    top: 109px;
    left: 2px;
    filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff);
}

/* En-tête : figurine, nom, traits, niveau */
.carte-recto .cr-entete {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 330px;
    overflow: hidden;
}

.carte-recto .cr-figurine {
    position: absolute;
    right: 140px;
    bottom: -45px;
    display: flex;
    justify-content: center;
    width: 280px;
    height: 375px;
    transform: translateX(50%);
    filter: drop-shadow(0 0 1px #000);
}

.carte-recto .cr-figurine img {
    flex: none;
    width: auto;
    height: 100%;
}

.carte-recto .cr-figurine.is-deplacable {
    cursor: grab;
}

.carte-recto .cr-figurine.is-deplacable:active {
    cursor: grabbing;
}

.carte-recto .cr-nom {
    position: absolute;
    top: 4px;
    left: 15px;
    z-index: 2;
    width: 600px;
    height: 62px;
    color: #fff;
    font-family: var(--cr-titre);
    font-size: 40px;
    font-weight: 600; /* Mitr SemiBold, seule graisse hébergée */
    line-height: 62px;
    letter-spacing: 1px;
    text-transform: uppercase;
    white-space: nowrap;
    transform: scale(1, 1.2);
    pointer-events: none;
}

.carte-recto .cr-nom .cr-minuscule {
    text-transform: none;
}

.carte-recto .cr-nom--ombre {
    z-index: 1;
    text-shadow:
        -2px 2px 2px #395858,
        2px -2px 2px #395858,
        2px 2px 2px #395858,
        -2px -2px 2px #395858;
}

/* Raretés du nom (dégradé du texte : seule exception à la règle « pas de dégradé », comme sur les cartes) */
.carte-recto[data-rarete='rare'] .cr-nom--texte {
    color: transparent;
    background: linear-gradient(180deg, #eee 38%, #fabc38 41%, #fdcc35 43%, #cb883d 55%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.carte-recto[data-rarete='rare'] .cr-nom--ombre {
    text-shadow:
        -2px 2px 2px #324444,
        2px -2px 2px #324444,
        2px 2px 2px #324444,
        -2px -2px 2px #324444;
}

/* Triple : nom noir, sans contour sombre (KrosCarte) */
.carte-recto[data-rarete='triple'] .cr-nom--texte {
    color: #000;
    font-size: 42px;
}

.carte-recto[data-rarete='triple'] .cr-nom--ombre {
    display: none;
}

.carte-recto[data-rarete='banni'] .cr-nom--texte {
    color: transparent;
    background: linear-gradient(180deg, #dd2424 43%, #b72323 55%, #8b2222 75%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.carte-recto[data-rarete='banni'] .cr-nom--ombre {
    text-shadow:
        0 0 3px #ffffffa1,
        0 0 3px #ffffffa1,
        0 0 3px #ffffffa1,
        0 0 3px #ffffffa1;
}

.carte-recto .cr-traits {
    position: absolute;
    top: 68px;
    left: 12px;
    color: #000;
    font-family: var(--cr-condense);
    font-size: 30px;
    line-height: 30px;
    white-space: nowrap;
    text-shadow:
        0 0 3px #fff,
        0 0 3px #fff,
        0 0 2px #fff;
}

.carte-recto .cr-niveau {
    position: absolute;
    top: 0;
    right: 0;
    width: 94px;
    height: 87px;
}

.carte-recto .cr-niveau img {
    width: 94px;
}

.carte-recto .cr-niveau-valeur {
    position: absolute;
    top: 0;
    width: 100%;
    color: #fff;
    font-family: var(--cr-fort);
    font-size: 44px;
    font-weight: 700;
    line-height: 87px;
    text-align: center;
    -webkit-text-stroke: thin #fff;
    text-shadow:
        4px 4px 4px #772d1a,
        -4px -4px 4px #772d1a,
        0 4px 4px #772d1a,
        -4px 4px 4px #772d1a,
        4px -4px 4px #772d1a,
        4px 0 4px #772d1a,
        0 -4px 4px #772d1a,
        -4px 0 4px #772d1a;
}

.carte-recto .cr-initiative {
    position: absolute;
    top: 124px;
    left: 9px;
    z-index: 6;
    width: 40px;
    height: 40px;
    line-height: 42px;
    color: #fff;
    font-family: var(--cr-fort);
    font-size: 32px;
    font-weight: 700;
    text-align: center;
    text-shadow:
        3px 3px 2px #ab6917,
        -3px -3px 2px #ab6917,
        0 0 2px #ab6917,
        -3px 3px 2px #ab6917,
        3px -3px 2px #ab6917,
        0 -3px 2px #ab6917,
        3px 0 2px #ab6917,
        0 3px 2px #ab6917,
        -3px 0 2px #ab6917;
}

/* Stats : PM, PV, PA */
.carte-recto .cr-stats {
    position: absolute;
    top: 158px;
    left: 5px;
    z-index: 6;
    width: 430px;
    height: 124px;
}

.carte-recto .cr-stat {
    position: absolute;
    top: 23px;
    width: 132px;
    color: #fff;
    font-family: var(--cr-fort);
    font-size: 85px;
    font-weight: 700;
    line-height: 85px;
    text-align: center;
    -webkit-text-stroke: 2px #fff;
    transform: scale(1, 1.15);
}

.carte-recto .cr-unite {
    position: absolute;
    top: 107px;
    width: 134px;
    color: #fff;
    font-family: var(--cr-condense);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
}

.carte-recto .cr-stat--PM,
.carte-recto .cr-unite--PM {
    left: 4px;
    filter: drop-shadow(0 0 4px #4d7015) drop-shadow(0 0 4px #4d7015) drop-shadow(0 0 4px #4d7015);
}

.carte-recto .cr-stat--PV,
.carte-recto .cr-unite--PV {
    left: 147px;
    filter: drop-shadow(0 0 4px #d42637) drop-shadow(0 0 4px #d42637) drop-shadow(0 0 4px #d42637);
}

.carte-recto .cr-stat--PA,
.carte-recto .cr-unite--PA {
    left: 293px;
    filter: drop-shadow(0 0 4px #1a388d) drop-shadow(0 0 4px #1a388d) drop-shadow(0 0 4px #1a388d);
}

/* Bas de la carte : sorts, histoire, pouvoirs (650 px de haut) */
.carte-recto .cr-bas {
    position: absolute;
    top: 300px;
    left: 5px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 684px;
    height: 650px;
}

.carte-recto .cr-bas.is-mesure {
    height: auto;
}

.carte-recto .cr-sorts {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.carte-recto .cr-sorts:empty {
    display: none;
}

/* Sort */
.carte-recto .cr-sort {
    position: relative;
    z-index: 4;
    width: 100%;
    min-height: 110px;
    box-sizing: border-box;
    background: #fff;
    border-radius: 3px 50px 50px 3px;
    box-shadow: #000 0 0 5px 1px;
}

.carte-recto .cr-sort.is-long {
    border-bottom-right-radius: 3px;
}

.carte-recto .cr-portee {
    position: absolute;
    margin: 5px;
    width: 100px;
    height: 100px;
    background: #000 0 0 / contain no-repeat;
}

.carte-recto .cr-portee-valeur {
    position: absolute;
    top: 74px;
    left: 5px;
    width: 100px;
    height: 30px;
    color: #fff;
    font-family: var(--cr-condense);
    font-size: 36px;
    font-weight: 700;
    line-height: 30px;
    text-align: center;
}

.carte-recto .cr-sort[data-portee='cac'] .cr-portee-valeur,
.carte-recto .cr-sort[data-portee='self'] .cr-portee-valeur {
    display: none;
}

.carte-recto .cr-portee-mini,
.carte-recto .cr-portee-maxi {
    position: absolute;
    bottom: 4px;
}

.carte-recto .cr-portee-mini {
    left: 7px;
}

.carte-recto .cr-portee-maxi {
    right: 7px;
}

.carte-recto .cr-sort-entete {
    position: absolute;
    top: 5px;
    left: 104px;
    z-index: 0;
    width: 450px;
    height: 43px;
    background-color: #000;
}

.carte-recto .cr-sort-entete[data-couleur='bleu'] {
    background-color: #167da6;
}

.carte-recto .cr-sort-entete[data-couleur='rouge'] {
    background-color: #d30b22;
}

.carte-recto .cr-sort-entete[data-couleur='violet'] {
    background-color: #913c8d;
}

/* Ombre en dégradé du bandeau, comme KrosCarte */
.carte-recto .cr-sort-ombre {
    position: absolute;
    width: 450px;
    height: 43px;
    background: linear-gradient(54deg, rgba(0, 0, 0, 0.7) 0%, transparent 20%);
    pointer-events: none;
}

.carte-recto .cr-sort-nom {
    position: relative;
    z-index: 10;
    width: 400px;
    height: 43px;
    padding-left: 10px;
    overflow: visible;
    color: #fff;
    font-family: var(--cr-fort);
    font-size: 34px;
    font-style: italic;
    font-weight: 700;
    line-height: 43px;
    white-space: nowrap;
    transform: scale(1, 1.15);
    transform-origin: 0 50%;
}

.carte-recto .cr-sort-entete.is-double-cout .cr-sort-nom {
    width: 330px;
}

.carte-recto .cr-sort-nom small {
    font-size: 0.75em;
}

.carte-recto .cr-couts {
    position: absolute;
    top: -1px;
    right: -27px;
    z-index: 4;
    width: 160px;
    height: 52px;
    background: right center no-repeat;
}

.carte-recto .cr-cout {
    position: absolute;
    top: 11px; /* 1 px plus haut que KrosCarte : centré avec TeX Gyre Heros */
    right: 7px;
    width: 40px;
    height: 30px;
    color: #fff;
    font-family: var(--cr-condense);
    font-size: 45px;
    font-weight: 700;
    line-height: 30px;
    text-align: center;
    -webkit-text-stroke: 1px #fff;
}

.carte-recto .cr-cout.is-gauche {
    right: 79px;
}

.carte-recto .cr-cout--PA {
    text-shadow:
        2px 2px 3px #1a388d,
        2px -2px 3px #1a388d,
        -2px 2px 3px #1a388d,
        -2px -2px 3px #1a388d,
        0 -2px 3px #1a388d,
        -2px 0 3px #1a388d,
        2px 0 3px #1a388d,
        0 2px 3px #1a388d;
}

.carte-recto .cr-cout--PV {
    text-shadow:
        2px 2px 3px #d42637,
        2px -2px 3px #d42637,
        -2px 2px 3px #d42637,
        -2px -2px 3px #d42637,
        0 -2px 3px #d42637,
        -2px 0 3px #d42637,
        2px 0 3px #d42637,
        0 2px 3px #d42637;
}

.carte-recto .cr-cout--kamas {
    text-shadow:
        2px 2px 3px #a7700d,
        2px -2px 3px #a7700d,
        -2px 2px 3px #a7700d,
        -2px -2px 3px #a7700d,
        0 -2px 3px #a7700d,
        -2px 0 3px #a7700d,
        2px 0 3px #a7700d,
        0 2px 3px #a7700d;
}

.carte-recto .cr-cout--PM {
    text-shadow:
        2px 2px 3px #134b2a,
        2px -2px 3px #134b2a,
        -2px 2px 3px #134b2a,
        -2px -2px 3px #134b2a,
        0 -2px 3px #134b2a,
        -2px 0 3px #134b2a,
        2px 0 3px #134b2a,
        0 2px 3px #134b2a;
}

.carte-recto .cr-effets {
    margin: 62px 0 4px 8px;
    font-family: var(--cr-texte);
    font-size: 27px;
    font-weight: 300;
    line-height: 40px;
    transform: scale(1, 1.15);
}

.carte-recto .cr-effets:empty {
    min-height: 40px;
}

.carte-recto .cr-effets .cr-bloc-gauche {
    float: left;
    width: 105px;
    height: 1em;
}

.carte-recto .cr-effets .cr-bloc-droite {
    float: right;
    width: 105px;
    height: 1.4em;
}

/* Styles des effets (KrosCarte) : normal, centré (plusieurs lignes, cartes 4.x) */
.carte-recto .cr-effets.is-centre {
    margin-bottom: 8px;
    line-height: 32px;
}

.carte-recto .cr-effets.is-centre .cr-bloc-gauche {
    height: 1.5em;
}

/* Compact : effets longs quand la carte manque de place (deux lignes tiennent dans la hauteur minimale d'un sort) */
.carte-recto .cr-effets.is-compact {
    margin-top: 56px;
    margin-bottom: 6px;
    line-height: 26px;
}

.carte-recto .cr-effets.is-compact .cr-bloc-gauche,
.carte-recto .cr-effets.is-compact .cr-bloc-droite {
    height: 1.5em;
}

.carte-recto .cr-effets .cr-icone {
    transform: scale(1, 0.87);
}

.carte-recto .cr-element {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: 0 0 / contain no-repeat;
}

.carte-recto .cr-degats {
    position: absolute;
    top: 9px; /* 8 px plus haut que KrosCarte : chiffre centré dans le rond avec TeX Gyre Heros */
    right: 25px;
    width: 50px;
    height: 70px;
    color: #fff;
    font-family: var(--cr-fort);
    font-size: 85px;
    font-weight: 700;
    line-height: 70px;
    text-align: center;
    filter: drop-shadow(3px 0 0 #000) drop-shadow(0 3px 0 #000) drop-shadow(0 -3px 0 #000) drop-shadow(-3px 0 0 #000);
}

.carte-recto .cr-element[data-element='soin'] .cr-degats {
    filter: drop-shadow(3px 0 0 #cf1650) drop-shadow(0 3px 0 #cf1650) drop-shadow(0 -3px 0 #cf1650) drop-shadow(-3px 0 0 #cf1650);
}

/* Histoire */
.carte-recto .cr-histoire {
    position: relative;
    z-index: 5;
    flex-grow: 1;
    width: 100%;
    background: #fff;
    border-radius: 3px 40px 3px 3px;
    box-shadow: #000 0 0 5px 1px;
}

.carte-recto .cr-bas.is-mesure .cr-histoire {
    flex-grow: 0;
}

.carte-recto .cr-histoire-titre {
    height: 43px;
    margin: 4px;
    padding-left: 10px;
    overflow: hidden;
    color: #fff;
    font-family: var(--cr-condense);
    font-size: 36px;
    font-style: italic;
    font-weight: 700;
    line-height: 43px;
    letter-spacing: 1px;
    white-space: nowrap;
    text-shadow: 0 0 5px #6a7f7d;
    background: url(../../images/carte/recto/histoire-fond.webp) 0 0 / contain no-repeat;
}

.carte-recto .cr-histoire-texte {
    margin: 5px 10px;
    color: #717c7a;
    font-family: var(--cr-texte);
    font-size: 27px;
    font-style: italic;
    font-weight: 300;
    line-height: 32px;
    text-align: justify;
}

/* Pouvoirs */
.carte-recto .cr-pouvoirs {
    position: relative;
    flex-grow: 0;
    width: 100%;
    min-height: 90px;
    box-sizing: border-box;
    background: #fff;
    border-radius: 3px;
    box-shadow: #000 0 0 5px 1px;
}

.carte-recto .cr-bas:not(.has-histoire) .cr-pouvoirs {
    flex-grow: 1;
}

.carte-recto .cr-bas.is-mesure .cr-pouvoirs {
    flex-grow: 0;
}

.carte-recto .cr-pouvoirs-titre {
    min-height: 30px;
    margin: 4px 4px 0;
    padding-left: 10px;
    color: #fff;
    font-family: var(--cr-condense);
    font-size: 36px;
    font-style: italic;
    font-weight: 700;
    line-height: 42px;
    letter-spacing: 2px;
    background: url(../../images/carte/recto/pouvoirs-fond.webp) 0 0 / cover no-repeat;
}

.carte-recto .cr-mention-carte {
    position: absolute;
    top: 0;
    right: 0;
    margin: 5px 6px 0 0;
    padding: 4px 5px;
    color: #eee;
    font-family: var(--cr-texte);
    font-size: 20px;
    font-weight: 300;
    line-height: 17px;
    text-align: end;
}

.carte-recto .cr-pouvoirs-liste {
    width: calc(100% - 20px);
    margin: 0 0 0 10px;
    padding: 4px 0;
    font-family: var(--cr-condense);
    font-size: 30px;
    font-weight: 700;
    line-height: 40px;
    letter-spacing: 1px;
}

.carte-recto .cr-pouvoirs-liste:empty {
    display: none;
}

.carte-recto .cr-legende {
    width: calc(100% - 20px);
    margin: 5px 0 10px 10px;
    font-family: var(--cr-texte);
    font-size: 23px;
    font-style: italic;
    font-weight: 300;
    line-height: 32px;
    transform: scale(1, 1.2);
}

.carte-recto .cr-legende:empty {
    display: none;
}

.carte-recto .cr-legende .cr-icone {
    transform: scale(1, 0.87);
}

/* Mise en forme des textes (KrosCarte : miseEnForme(), decoderIcones()) */
.carte-recto .cr-icone {
    height: 1.25em;
    margin: -0.265em 5px;
    vertical-align: 0;
}

.carte-recto .cr-insecable {
    white-space: nowrap;
}

.carte-recto .cr-zone {
    padding: 0 2px;
}

.carte-recto .cr-parentheses {
    font-size: calc(100% - 2px);
    font-style: normal;
}

.carte-recto .cr-effets b,
.carte-recto .cr-legende b {
    font-weight: 600;
    letter-spacing: 1px;
}

.carte-recto .cr-effets b.cr-majuscules,
.carte-recto .cr-legende b.cr-majuscules {
    font-family: var(--cr-condense);
    font-size: 1.05em;
    font-weight: 700;
    letter-spacing: 1px;
}

.carte-recto .cr-chiffre {
    font-weight: 600;
}

/* Pied de carte : série, version, crédit */
.carte-recto .cr-pied {
    position: absolute;
    bottom: 7px;
    left: 62px;
    display: flex;
    justify-content: space-between;
    width: 510px;
    height: 32px;
    padding: 0 30px;
    color: #3a5451;
    font-family: var(--cr-condense);
    font-size: 19px;
    font-style: italic;
    line-height: 32px;
    text-align: center;
    white-space: nowrap;
    background: #fff;
    border-radius: 0 0 10px 10px;
}

.carte-recto .cr-pied-serie {
    max-width: 220px;
    overflow: hidden;
    color: #000;
    font-size: 21px;
    text-overflow: ellipsis;
}

.carte-recto .cr-pied-version {
    font-style: normal;
    font-weight: 600;
}

.carte-recto .cr-pied-version img {
    width: 25px;
    margin-right: 5px;
    vertical-align: -5px;
}

.carte-recto .cr-pied-decor {
    position: absolute;
    top: 0;
    right: -55px;
    width: 68px;
    height: 36px;
    background: url(../../images/carte/recto/decor-dofus.webp) right / contain no-repeat;
}

.carte-recto .cr-pied-decor--gauche {
    right: auto;
    left: -55px;
    transform: scaleX(-1);
}
