/* ============================================
   Jeux imprimables - Styles ecran et impression
   Cartes de 7 familles conjugaison
   ============================================ */

/* --- Section configuration --- */

.jeux-section {
    max-width: 900px;
    margin: 0 auto;
    padding: 20px;
}

.jeux-titre {
    text-align: center;
    margin-bottom: 24px;
    color: var(--text);
}

.config-form {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.config-field {
    flex: 1;
    min-width: 180px;
}

.config-field label {
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--text);
    font-size: 0.9rem;
}

.config-field select {
    width: 100%;
    padding: 10px 12px;
    border: 2px solid #e0e0e0;
    border-radius: var(--radius);
    font-size: 1rem;
    background: var(--white);
    color: var(--text);
}

.config-field select:focus {
    border-color: var(--primary);
    outline: none;
}

/* --- Selection verbes --- */

.verbes-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    flex-wrap: wrap;
    gap: 10px;
}

.verbes-header h3 {
    margin: 0;
    color: var(--text);
}

.compteur-verbes {
    font-weight: 700;
    color: var(--primary);
    font-size: 1rem;
    background: var(--bg);
    padding: 4px 12px;
    border-radius: 20px;
}

.compteur-verbes.complet {
    background: #e8f5e9;
    color: #2e7d32;
}

.btn-suggestion {
    padding: 8px 16px;
    border: 2px solid var(--primary);
    border-radius: var(--radius);
    background: var(--white);
    color: var(--primary);
    font-weight: 600;
    cursor: pointer;
    font-size: 0.9rem;
    transition: all 0.2s;
}

.btn-suggestion:hover {
    background: var(--primary);
    color: var(--white);
}

.verbes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 8px;
    margin-bottom: 20px;
}

.verbe-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 2px solid #e0e0e0;
    border-radius: var(--radius);
    cursor: pointer;
    transition: all 0.2s;
    background: var(--white);
}

.verbe-checkbox:hover {
    border-color: var(--primary);
    background: #f5f5f5;
}

.verbe-checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--primary);
    cursor: pointer;
}

.verbe-checkbox input[type="checkbox"]:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.verbe-checkbox input[type="checkbox"]:disabled + .verbe-nom {
    opacity: 0.4;
}

.verbe-checkbox input[type="checkbox"]:checked + .verbe-nom {
    font-weight: 700;
    color: var(--primary);
}

.verbe-nom {
    flex: 1;
    font-size: 0.95rem;
}

.verbe-groupe {
    font-size: 0.75rem;
}

.verbe-ia {
    border-color: #ffb74d;
    background: #fff8e1;
}

.ia-badge {
    font-size: 0.65rem;
    font-weight: 700;
    color: #fff;
    background: #ff9800;
    padding: 2px 6px;
    border-radius: 4px;
    letter-spacing: 0.5px;
}

/* --- Ajout verbe libre --- */

.ajout-verbe {
    display: flex;
    gap: 10px;
    margin-bottom: 24px;
    align-items: center;
}

.ajout-verbe input {
    flex: 1;
    max-width: 300px;
    padding: 10px 12px;
    border: 2px solid #e0e0e0;
    border-radius: var(--radius);
    font-size: 0.95rem;
}

.ajout-verbe input:focus {
    border-color: var(--primary);
    outline: none;
}

.ajout-verbe button {
    padding: 10px 20px;
    border: none;
    border-radius: var(--radius);
    background: var(--primary);
    color: var(--white);
    font-weight: 600;
    cursor: pointer;
    font-size: 0.9rem;
    transition: opacity 0.2s;
}

.ajout-verbe button:hover {
    opacity: 0.9;
}

.ajout-verbe button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.ajout-verbe .ia-info {
    font-size: 0.8rem;
    color: #ff9800;
    font-style: italic;
}

/* --- Bouton generer --- */

.btn-generer {
    display: block;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    padding: 14px 24px;
    border: none;
    border-radius: var(--radius);
    background: var(--primary);
    color: var(--white);
    font-size: 1.1rem;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.2s;
}

.btn-generer:hover:not(:disabled) {
    opacity: 0.9;
}

.btn-generer:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* --- Apercu actions --- */

.apercu-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.apercu-actions .btn-action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border: 2px solid #e0e0e0;
    border-radius: var(--radius);
    background: var(--white);
    color: var(--text);
    font-weight: 600;
    cursor: pointer;
    font-size: 0.95rem;
    transition: all 0.2s;
}

.apercu-actions .btn-action:hover {
    border-color: var(--primary);
    color: var(--primary);
}

.apercu-actions .btn-action.primary {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
}

.apercu-actions .btn-action.primary:hover {
    opacity: 0.9;
}

/* --- Grille apercu ecran --- */

.cartes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
    gap: 12px;
    padding-bottom: 40px;
}

/* --- Carte (ecran) --- */

.carte {
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    background: var(--white);
    display: flex;
    flex-direction: column;
    font-size: 0.8rem;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    transition: transform 0.2s;
}

.carte:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}

.carte-header {
    padding: 6px 8px;
    border-bottom: 1px solid #eee;
    background: #fafafa;
}

.carte-famille {
    font-size: 0.7rem;
    color: var(--text);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.carte-famille strong {
    color: #000;
}

.carte-groupe-label {
    font-size: 0.65rem;
    color: var(--text-light);
    font-style: italic;
}

.carte-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 12px 8px;
    gap: 4px;
    min-height: 70px;
}

.carte-pronom {
    font-weight: 700;
    color: #1565c0;
    font-size: 0.95rem;
}

.carte-auxiliaire {
    color: #757575;
    font-weight: 500;
    font-size: 0.85rem;
}

.carte-infinitif-verbe {
    font-weight: 700;
    font-style: italic;
    color: #000;
    font-size: 0.85rem;
}

/* Etiquettes dans les cartes (override conjugaison.css sizes) */
.carte .etiquette-container {
    margin: 2px 0;
}

.carte .etiquette-radical {
    font-size: 0.85rem;
    padding: 4px 3px 4px 8px;
    line-height: 1.2;
}

.carte .etiquette-terminaison {
    font-size: 0.85rem;
    padding: 4px 8px 4px 3px;
    line-height: 1.2;
}

.carte-footer {
    padding: 5px 8px;
    text-align: center;
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* --- Carte vide (placeholder) --- */

.carte-vide {
    border: 2px dashed #e0e0e0;
    border-radius: 8px;
    background: transparent;
    min-height: 80px;
}

/* --- Tailles de police des cartes --- */

/* Petite */
.taille-petite .carte { font-size: 0.65rem; }
.taille-petite .carte-pronom { font-size: 0.8rem; }
.taille-petite .carte-auxiliaire { font-size: 0.7rem; }
.taille-petite .carte-infinitif-verbe { font-size: 0.7rem; }
.taille-petite .carte .etiquette-radical,
.taille-petite .carte .etiquette-terminaison { font-size: 0.7rem; padding: 3px 2px 3px 6px; }
.taille-petite .carte .etiquette-terminaison { padding: 3px 6px 3px 2px; }
.taille-petite .carte-footer { font-size: 0.6rem; }
.taille-petite .carte-famille { font-size: 0.6rem; }
.taille-petite .carte-body { min-height: 55px; padding: 8px 6px; }

/* Normale = valeurs par defaut (pas de surcharge) */

/* Grande */
.taille-grande .carte { font-size: 0.95rem; }
.taille-grande .carte-pronom { font-size: 1.15rem; }
.taille-grande .carte-auxiliaire { font-size: 1rem; }
.taille-grande .carte-infinitif-verbe { font-size: 1rem; }
.taille-grande .carte .etiquette-radical,
.taille-grande .carte .etiquette-terminaison { font-size: 1rem; padding: 5px 4px 5px 10px; }
.taille-grande .carte .etiquette-terminaison { padding: 5px 10px 5px 4px; }
.taille-grande .carte-footer { font-size: 0.8rem; }
.taille-grande .carte-famille { font-size: 0.8rem; }
.taille-grande .carte-body { min-height: 85px; padding: 14px 10px; gap: 6px; }
.taille-grande.cartes-grid { grid-template-columns: repeat(auto-fill, minmax(185px, 1fr)); }

/* Tres grande */
.taille-tres-grande .carte { font-size: 1.1rem; }
.taille-tres-grande .carte-pronom { font-size: 1.35rem; }
.taille-tres-grande .carte-auxiliaire { font-size: 1.15rem; }
.taille-tres-grande .carte-infinitif-verbe { font-size: 1.15rem; }
.taille-tres-grande .carte .etiquette-radical,
.taille-tres-grande .carte .etiquette-terminaison { font-size: 1.15rem; padding: 6px 5px 6px 12px; }
.taille-tres-grande .carte .etiquette-terminaison { padding: 6px 12px 6px 5px; }
.taille-tres-grande .carte-footer { font-size: 0.9rem; padding: 7px 8px; }
.taille-tres-grande .carte-famille { font-size: 0.85rem; }
.taille-tres-grande .carte-groupe-label { font-size: 0.75rem; }
.taille-tres-grande .carte-body { min-height: 100px; padding: 16px 10px; gap: 8px; }
.taille-tres-grande.cartes-grid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }

/* ============================================
   IDENTIFICATION DE SERIE
   ============================================ */

.serie-config {
    margin-bottom: 20px;
    padding: 14px 16px;
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: var(--radius);
}

.serie-config-row {
    display: flex;
    gap: 20px;
    align-items: flex-end;
    flex-wrap: wrap;
}

.serie-nom-field {
    min-width: 200px;
    max-width: 300px;
}

.serie-nom-field input {
    width: 100%;
    padding: 8px 12px;
    border: 2px solid #e0e0e0;
    border-radius: var(--radius);
    font-size: 0.95rem;
    background: var(--white);
}

.serie-nom-field input:focus {
    border-color: var(--primary);
    outline: none;
}

.serie-symbole-field {
    min-width: auto;
}

.serie-symboles {
    display: flex;
    gap: 6px;
}

.serie-symbole-btn {
    width: 36px;
    height: 36px;
    border: 2px solid #e0e0e0;
    border-radius: 6px;
    background: var(--white);
    font-size: 1.2rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.serie-symbole-btn:hover {
    border-color: #999;
    transform: scale(1.1);
}

.serie-symbole-btn.active {
    border-color: currentColor;
    background: #f5f5f5;
    box-shadow: 0 0 0 2px currentColor;
    transform: scale(1.1);
}

.series-historique {
    margin-top: 10px;
    font-size: 0.8rem;
    color: var(--text-light);
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.series-historique-label {
    font-weight: 600;
    color: var(--text);
    font-size: 0.75rem;
}

.serie-tag {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 8px;
    background: var(--white);
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

/* Marqueur de serie (sur les cartes/dominos/grilles) */
.serie-marqueur {
    font-size: 0.6rem;
    font-weight: 700;
    white-space: nowrap;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

/* Marqueur dans les cartes 7 familles */
.carte-header-right {
    display: flex;
    align-items: center;
    gap: 6px;
}

.carte-header-right .carte-groupe-label {
    font-size: 0.65rem;
    color: var(--text-light);
    font-style: italic;
}

/* Marqueur dans les dominos */
.domino-serie {
    text-align: right;
    padding: 2px 8px 4px;
    border-top: 1px solid #eee;
}

/* ============================================
   MODE FAMILLES (par verbe / par temps)
   ============================================ */

.familles-mode-selector {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.radio-label {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border: 2px solid #e0e0e0;
    border-radius: var(--radius);
    cursor: pointer;
    transition: all 0.2s;
    background: var(--white);
    flex: 1;
    min-width: 200px;
}

.radio-label:hover {
    border-color: var(--primary);
    background: #f5f5f5;
}

.radio-label:has(input:checked) {
    border-color: var(--primary);
    background: #e3f2fd;
}

.radio-label input[type="radio"] {
    accent-color: var(--primary);
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.radio-text {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--text);
}

.radio-label small {
    font-size: 0.75rem;
    color: var(--text-light);
    margin-left: auto;
}

/* Temps checkboxes (bande coloree) */
.temps-cb-bande {
    width: 24px;
    height: 8px;
    border-radius: 4px;
    display: inline-block;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.temps-cb-item {
    border-left: 4px solid transparent;
}

.temps-cb-item.categorie-present { border-left-color: #e53935; }
.temps-cb-item.categorie-passe { border-left-color: #1565c0; }
.temps-cb-item.categorie-futur { border-left-color: #2e7d32; }

#section-temps-cb {
    margin-bottom: 20px;
}

#section-temps-cb .verbes-grid {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}

/* ============================================
   SELECTEUR TYPE DE JEU
   ============================================ */

.jeu-type-selector {
    display: flex;
    gap: 0;
    margin-bottom: 20px;
    border-radius: var(--radius);
    overflow: hidden;
    border: 2px solid #e0e0e0;
}

.jeu-type-btn {
    flex: 1;
    padding: 12px 16px;
    border: none;
    background: var(--white);
    color: var(--text);
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.2s;
    border-right: 1px solid #e0e0e0;
}

.jeu-type-btn:last-child {
    border-right: none;
}

.jeu-type-btn:hover {
    background: #f5f5f5;
}

.jeu-type-btn.active {
    background: var(--primary);
    color: var(--white);
}

.options-jeu {
    margin-bottom: 16px;
}

/* ============================================
   DOMINOS (ecran)
   ============================================ */

.dominos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 10px;
    padding-bottom: 40px;
}

.domino {
    display: flex;
    flex-direction: column;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    background: var(--white);
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    transition: transform 0.2s;
}

.domino:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}

.domino-bande {
    height: 4px;
}

.domino-contenu {
    display: flex;
    align-items: stretch;
    min-height: 60px;
}

.domino-gauche,
.domino-droite {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 10px;
    text-align: center;
}

.domino-separateur {
    width: 2px;
    background: #424242;
    align-self: stretch;
}

.domino-texte {
    font-size: 0.95rem;
    font-weight: 600;
    color: #000;
}

.domino-question {
    color: #1565c0;
}

/* Tailles police dominos */
.taille-petite .domino-texte { font-size: 0.8rem; }
.taille-petite .domino-contenu { min-height: 45px; }
.taille-grande .domino-texte { font-size: 1.1rem; }
.taille-grande .domino-contenu { min-height: 70px; }
.taille-tres-grande .domino-texte { font-size: 1.3rem; }
.taille-tres-grande .domino-contenu { min-height: 80px; }

/* ============================================
   LOTO (ecran)
   ============================================ */

.loto-apercu {
    max-width: 900px;
    margin: 0 auto;
    padding-bottom: 40px;
}

.loto-section-titre {
    margin: 24px 0 12px;
    color: var(--text);
    font-size: 1.1rem;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 8px;
}

.loto-section-titre:first-child {
    margin-top: 0;
}

.loto-grille {
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    background: var(--white);
    margin-bottom: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}

.loto-grille-header {
    padding: 10px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.loto-grille-titre {
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.loto-grille-info {
    font-size: 0.8rem;
    font-weight: 600;
}

.loto-grille-cases {
    display: grid;
}

.loto-case {
    border: 1px solid #e0e0e0;
    padding: 20px 12px;
    text-align: center;
    font-weight: 600;
    font-size: 1rem;
    color: #000;
    min-height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Tailles police loto */
.taille-petite .loto-case { font-size: 0.85rem; padding: 14px 8px; }
.taille-grande .loto-case { font-size: 1.15rem; padding: 24px 14px; }
.taille-tres-grande .loto-case { font-size: 1.3rem; padding: 28px 16px; }

/* Pioche (ecran) */
.pioche-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 8px;
}

.pioche-carte {
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    background: var(--white);
    text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.pioche-bande {
    height: 4px;
}

.pioche-pronom {
    font-weight: 700;
    color: #1565c0;
    font-size: 0.9rem;
    padding: 10px 8px 2px;
}

.pioche-infinitif {
    font-weight: 700;
    color: #000;
    font-size: 0.95rem;
    padding: 2px 8px 10px;
}

/* Tailles police pioche */
.taille-petite .pioche-pronom { font-size: 0.75rem; }
.taille-petite .pioche-infinitif { font-size: 0.8rem; }
.taille-grande .pioche-pronom { font-size: 1.05rem; }
.taille-grande .pioche-infinitif { font-size: 1.1rem; }
.taille-tres-grande .pioche-pronom { font-size: 1.2rem; }
.taille-tres-grande .pioche-infinitif { font-size: 1.25rem; }

/* ============================================
   DOBBLE (ecran)
   ============================================ */

.dobble-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
    padding-bottom: 40px;
    justify-items: center;
}

.dobble-carte {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    border: 3px solid #e0e0e0;
    background: var(--white);
    position: relative;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    overflow: hidden;
}

.dobble-carte:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

.dobble-carte-inner {
    position: absolute;
    top: 12px; left: 12px; right: 12px; bottom: 12px;
}

.dobble-symbole {
    position: absolute;
    text-align: center;
    white-space: nowrap;
}

.dobble-symbole-pronom {
    font-size: 0.55rem;
    color: #1565c0;
    font-weight: 600;
    display: block;
    line-height: 1;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.dobble-symbole-forme {
    font-size: 0.8rem;
    color: #000;
    font-weight: 700;
    display: block;
    line-height: 1.2;
}

.dobble-radical {
    color: #000;
    font-weight: 700;
}

.dobble-terminaison {
    font-weight: 700;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.dobble-auxiliaire {
    color: #757575;
    font-weight: 500;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.dobble-symbole-bonus {
    font-size: 1rem;
    color: #f57c00;
    font-weight: 800;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.dobble-serie {
    position: absolute;
    bottom: 4px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}

/* Tailles dobble ecran */
.taille-petite .dobble-carte { width: 160px; height: 160px; }
.taille-petite .dobble-symbole-pronom { font-size: 0.45rem; }
.taille-petite .dobble-symbole-forme { font-size: 0.65rem; }
.taille-petite .dobble-symbole-bonus { font-size: 0.8rem; }

.taille-grande .dobble-carte { width: 240px; height: 240px; }
.taille-grande .dobble-symbole-pronom { font-size: 0.65rem; }
.taille-grande .dobble-symbole-forme { font-size: 0.95rem; }
.taille-grande .dobble-symbole-bonus { font-size: 1.2rem; }

.taille-tres-grande .dobble-carte { width: 280px; height: 280px; }
.taille-tres-grande .dobble-symbole-pronom { font-size: 0.75rem; }
.taille-tres-grande .dobble-symbole-forme { font-size: 1.1rem; }
.taille-tres-grande .dobble-symbole-bonus { font-size: 1.4rem; }

/* --- Zone impression (masquee a l'ecran) --- */

.zone-impression {
    display: none;
}

/* ============================================
   IMPRESSION
   ============================================ */

@page {
    size: A4 landscape;
    margin: 0;
}

@media print {
    /* Reset body pour impression */
    html, body {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        line-height: normal !important;
    }

    /* Masquer tout sauf la zone impression */
    body > *:not(.zone-impression) {
        display: none !important;
    }

    .zone-impression {
        display: block !important;
        margin: 0;
        padding: 0;
    }

    /* --- Page de cartes --- */

    .print-page {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(2, 1fr);
        width: 100%;
        height: 197mm;
        page-break-after: always;
        box-sizing: border-box;
    }

    .print-page.print-dos {
        height: 210mm;
    }

    .print-page:last-child {
        page-break-after: auto;
    }

    /* --- Carte imprimee (recto) --- */

    .print-page .carte {
        border: 1px dashed #999;
        border-radius: 0;
        box-shadow: none;
        font-size: 11pt;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        box-sizing: border-box;
    }

    .print-page .carte:hover {
        transform: none;
        box-shadow: none;
    }

    .print-page .carte-header {
        padding: 6px 10px;
        border-bottom: 1px solid #ccc;
        background: #fafafa;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .print-page .carte-famille {
        font-size: 9pt;
    }

    .print-page .carte-groupe-label {
        font-size: 8pt;
    }

    .print-page .carte-body {
        flex: 1;
        padding: 10px 8px;
        min-height: 0;
        gap: 3px;
    }

    .print-page .carte-pronom {
        font-size: 13pt;
        color: #1565c0;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .print-page .carte-auxiliaire {
        font-size: 11pt;
        color: #757575;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .print-page .carte-infinitif-verbe {
        font-size: 11pt;
    }

    .print-page .carte .etiquette-radical {
        font-size: 11pt;
        padding: 4px 3px 4px 10px;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .print-page .carte .etiquette-terminaison {
        font-size: 11pt;
        padding: 4px 10px 4px 3px;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .print-page .carte-footer {
        padding: 6px 8px;
        font-size: 9pt;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* --- Carte vide (placeholder impression) --- */

    .print-page .carte-vide {
        border: 1px dashed #ccc;
        background: transparent;
        min-height: 0;
    }

    /* --- Dos de carte --- */

    .carte-dos {
        border: 1px dashed #999;
        border-radius: 0;
        box-shadow: none;
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        background: #fff;
    }

    .dos-bordure {
        width: 80%;
        height: 75%;
        border: 3px solid currentColor;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .dos-contenu {
        text-align: center;
    }

    .dos-titre {
        font-size: 14pt;
        font-weight: 700;
        color: #333;
        margin-bottom: 8px;
        letter-spacing: 1px;
    }

    .dos-temps {
        font-size: 12pt;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-bottom: 4px;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .dos-niveau {
        font-size: 10pt;
        color: #666;
        font-weight: 600;
    }

    /* --- Tailles de police impression --- */

    /* Petite */
    .taille-petite .print-page .carte { font-size: 9pt; }
    .taille-petite .print-page .carte-pronom { font-size: 10pt; }
    .taille-petite .print-page .carte-auxiliaire { font-size: 9pt; }
    .taille-petite .print-page .carte .etiquette-radical,
    .taille-petite .print-page .carte .etiquette-terminaison { font-size: 9pt; }
    .taille-petite .print-page .carte-footer { font-size: 7pt; }
    .taille-petite .print-page .carte-famille { font-size: 7pt; }

    /* Grande */
    .taille-grande .print-page .carte { font-size: 13pt; }
    .taille-grande .print-page .carte-pronom { font-size: 16pt; }
    .taille-grande .print-page .carte-auxiliaire { font-size: 13pt; }
    .taille-grande .print-page .carte .etiquette-radical,
    .taille-grande .print-page .carte .etiquette-terminaison { font-size: 13pt; }
    .taille-grande .print-page .carte-footer { font-size: 10pt; }
    .taille-grande .print-page .carte-famille { font-size: 10pt; }

    /* Tres grande */
    .taille-tres-grande .print-page .carte { font-size: 15pt; }
    .taille-tres-grande .print-page .carte-pronom { font-size: 18pt; }
    .taille-tres-grande .print-page .carte-auxiliaire { font-size: 15pt; }
    .taille-tres-grande .print-page .carte .etiquette-radical,
    .taille-tres-grande .print-page .carte .etiquette-terminaison { font-size: 15pt; }
    .taille-tres-grande .print-page .carte-footer { font-size: 12pt; }
    .taille-tres-grande .print-page .carte-famille { font-size: 11pt; }

    /* Forcer les couleurs a l'impression */
    .temps-present,
    .temps-imperatif,
    .temps-imparfait,
    .temps-passe_compose,
    .temps-passe_simple,
    .temps-plus_que_parfait,
    .temps-futur,
    .temps-futur_proche,
    .temps-conditionnel {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .categorie-present .etiquette-terminaison,
    .categorie-passe .etiquette-terminaison,
    .categorie-futur .etiquette-terminaison {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .etiquette-radical {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* --- Marqueur serie (impression) --- */

    .serie-marqueur {
        font-size: 7pt;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .dos-serie {
        margin-top: 6px;
    }

    .dos-serie .serie-marqueur {
        font-size: 8pt;
    }

    .domino-print-serie {
        text-align: right;
        padding: 1px 6px 2px;
        border-top: 1px solid #ccc;
    }

    .domino-print-serie .serie-marqueur {
        font-size: 6pt;
    }

    /* ============================================
       DOMINOS (impression)
       ============================================ */

    .print-page-dominos {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(5, 1fr);
        width: 100%;
        height: 197mm;
        page-break-after: always;
        box-sizing: border-box;
        gap: 0;
    }

    .print-page-dominos:last-child {
        page-break-after: auto;
    }

    .domino-print {
        display: flex;
        flex-direction: column;
        border: 1px dashed #999;
        box-sizing: border-box;
        overflow: hidden;
    }

    .domino-print-bande {
        height: 3px;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .domino-print-contenu {
        display: flex;
        align-items: stretch;
        flex: 1;
    }

    .domino-print-gauche,
    .domino-print-droite {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 6px 8px;
        text-align: center;
        font-size: 11pt;
        font-weight: 600;
    }

    .domino-print-sep {
        width: 2px;
        background: #424242;
        align-self: stretch;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .domino-print .domino-question {
        color: #1565c0;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .domino-print-vide {
        border: 1px dashed #ccc;
    }

    /* Tailles dominos impression */
    .taille-petite .domino-print-gauche,
    .taille-petite .domino-print-droite { font-size: 9pt; }
    .taille-grande .domino-print-gauche,
    .taille-grande .domino-print-droite { font-size: 13pt; }
    .taille-tres-grande .domino-print-gauche,
    .taille-tres-grande .domino-print-droite { font-size: 15pt; }

    /* ============================================
       LOTO (impression)
       ============================================ */

    .print-page-loto {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        width: 100%;
        height: 197mm;
        page-break-after: always;
        box-sizing: border-box;
        gap: 15mm;
        padding: 5mm 0;
    }

    .print-page-loto:last-child {
        page-break-after: auto;
    }

    .loto-grille-print {
        border: 2px solid #999;
        overflow: hidden;
        flex: 1;
        display: flex;
        flex-direction: column;
    }

    .loto-grille-print-header {
        padding: 8px 16px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .loto-print-titre {
        font-weight: 700;
        font-size: 11pt;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    .loto-print-info {
        font-size: 9pt;
        font-weight: 600;
    }

    .loto-grille-print-cases {
        display: grid;
        flex: 1;
    }

    .loto-case-print {
        border: 1px solid #999;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-weight: 600;
        font-size: 14pt;
        padding: 8px;
    }

    /* Tailles loto impression */
    .taille-petite .loto-case-print { font-size: 11pt; }
    .taille-grande .loto-case-print { font-size: 16pt; }
    .taille-tres-grande .loto-case-print { font-size: 18pt; }

    /* --- Pioche impression --- */

    .print-page-pioche {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(6, 1fr);
        width: 100%;
        height: 197mm;
        page-break-after: always;
        box-sizing: border-box;
        gap: 0;
    }

    .print-page-pioche:last-child {
        page-break-after: auto;
    }

    .pioche-carte-print {
        border: 1px dashed #999;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        box-sizing: border-box;
    }

    .pioche-carte-print-bande {
        height: 4px;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .pioche-carte-print-body {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 8px;
    }

    .pioche-print-pronom {
        font-weight: 700;
        color: #1565c0;
        font-size: 14pt;
        margin-bottom: 6px;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .pioche-print-infinitif {
        font-weight: 700;
        color: #000;
        font-size: 16pt;
    }

    .pioche-carte-print-vide {
        border: 1px dashed #ccc;
    }

    /* Tailles pioche impression */
    .taille-petite .pioche-print-pronom { font-size: 11pt; }
    .taille-petite .pioche-print-infinitif { font-size: 13pt; }
    .taille-grande .pioche-print-pronom { font-size: 16pt; }
    .taille-grande .pioche-print-infinitif { font-size: 18pt; }
    .taille-tres-grande .pioche-print-pronom { font-size: 18pt; }
    .taille-tres-grande .pioche-print-infinitif { font-size: 20pt; }

    /* ============================================
       DOBBLE (impression)
       ============================================ */

    .print-page-dobble {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, 1fr);
        width: 100%;
        height: 197mm;
        page-break-after: always;
        box-sizing: border-box;
        align-items: center;
        justify-items: center;
    }

    .print-page-dobble:last-child {
        page-break-after: auto;
    }

    .dobble-carte-print {
        width: 85mm;
        height: 85mm;
        border-radius: 50%;
        border: 1px dashed #999;
        position: relative;
        box-sizing: border-box;
        overflow: hidden;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .dobble-carte-print .dobble-carte-inner {
        position: absolute;
        top: 8mm; left: 8mm; right: 8mm; bottom: 8mm;
    }

    .dobble-carte-print .dobble-symbole-pronom {
        font-size: 8pt;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .dobble-carte-print .dobble-symbole-forme {
        font-size: 11pt;
    }

    .dobble-carte-print .dobble-symbole-bonus {
        font-size: 13pt;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .dobble-carte-print .dobble-serie {
        bottom: 2mm;
    }

    .dobble-carte-print-vide {
        width: 85mm;
        height: 85mm;
        border-radius: 50%;
        border: 1px dashed #ccc;
    }

    /* Tailles dobble impression */
    .taille-petite .dobble-carte-print .dobble-symbole-pronom { font-size: 7pt; }
    .taille-petite .dobble-carte-print .dobble-symbole-forme { font-size: 9pt; }
    .taille-petite .dobble-carte-print .dobble-symbole-bonus { font-size: 11pt; }
    .taille-grande .dobble-carte-print .dobble-symbole-pronom { font-size: 9pt; }
    .taille-grande .dobble-carte-print .dobble-symbole-forme { font-size: 13pt; }
    .taille-grande .dobble-carte-print .dobble-symbole-bonus { font-size: 15pt; }
    .taille-tres-grande .dobble-carte-print .dobble-symbole-pronom { font-size: 10pt; }
    .taille-tres-grande .dobble-carte-print .dobble-symbole-forme { font-size: 15pt; }
    .taille-tres-grande .dobble-carte-print .dobble-symbole-bonus { font-size: 17pt; }
}