/**
 * Simulateur d'expression écrite — couche de design harmonisée.
 *
 * Chargée en dernier et uniquement sur la page du simulateur (classe de page
 * « tcf-ws-page », voir class-shortcodes.php). Toutes les règles sont préfixées
 * par body.tcf-ws-page : les autres pages qui chargent les styles du simulateur
 * (Mes travaux, Expression écrite, sujets…) ne sont pas concernées.
 *
 * Langage commun aux pages refaites : cartes blanches à bordure fine, rayons de
 * 12 à 16 px, bleu #1363DF pour l'action principale, couleurs par tâche
 * (T1 bleu, T2 vert, T3 indigo), fenêtres et notifications d'un seul modèle.
 * Pour revenir en arrière : retirer l'enqueue « tcf-simulator-ui » (class-assets.php).
 */

body.tcf-ws-page {
    --ws-blue: #1363DF;
    --ws-blue-dark: #0F52C0;
    --ws-blue-soft: #EEF4FF;
    --ws-blue-line: #CDDDF7;
    --ws-navy: #082A5E;
    --ws-ink: #0F172A;
    --ws-slate: #334155;
    --ws-muted: #64748B;
    --ws-faint: #94A3B8;
    --ws-line: #E2E8F0;
    --ws-soft: #F8FAFC;
    --ws-page: #F1F5F9;
    --ws-green: #12BB6A;
    --ws-green-dark: #0E9A57;
    --ws-green-ink: #047857;
    --ws-green-soft: #ECFDF5;
    --ws-green-line: #BBF7D0;
    --ws-amber: #F59E0B;
    --ws-amber-ink: #B45309;
    --ws-amber-soft: #FFFBEB;
    --ws-amber-line: #FDE68A;
    --ws-red: #EF4444;
    --ws-red-ink: #B91C1C;
    --ws-red-soft: #FEF2F2;
    --ws-red-line: #FECACA;
    --ws-indigo: #4F46E5;
    --ws-indigo-ink: #4338CA;
    --ws-indigo-soft: #EEF2FF;
    --ws-indigo-line: #C7D2FE;
    --ws-radius: 14px;
    --ws-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    --ws-shadow-modal: 0 24px 60px rgba(15, 23, 42, 0.22);
    --ws-font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: var(--ws-page);
}

/* ═════════════════════════════ Mise en page ═════════════════════════════ */

body.tcf-ws-page .tcf-simulator-container,
body.tcf-ws-page .simulator__container,
body.tcf-ws-page .simulator--main__container {
    background: var(--ws-page);
}

body.tcf-ws-page .simulator__container {
    max-width: 1400px !important;
    padding: 24px;
    font-family: var(--ws-font) !important;
    color: var(--ws-ink);
}

body.tcf-ws-page .main-layout {
    grid-template-columns: 260px minmax(0, 1fr) 290px;
    gap: 20px;
    min-height: 0;
}

body.tcf-ws-page .main-layout > .sidebar {
    padding: 18px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: var(--ws-radius);
    box-shadow: var(--ws-shadow);
}

/* Colonnes latérales collantes : tâches, chrono et actions restent visibles pendant la rédaction */
body.tcf-ws-page .main-layout > .sidebar.left-sidebar,
body.tcf-ws-page .main-layout > .sidebar.right-sidebar {
    position: sticky;
    top: calc(var(--wp-admin--admin-bar--height, 0px) + 20px);
}

body.tcf-ws-page .main-layout > .sidebar.right-sidebar {
    display: flex;
    flex-direction: column;
    gap: 0;
    height: auto;
}

body.tcf-ws-page .sidebar h3 {
    margin: 0 0 12px;
    font-family: var(--ws-font);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.08em;
    line-height: 1.4;
    text-transform: uppercase;
    color: var(--ws-muted);
}

/* ═════════════════════════════ Colonne des tâches ═════════════════════════════ */

body.tcf-ws-page .sidebar h3 .mode-libre {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    border-radius: 6px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.6;
    color: var(--ws-amber-ink);
    vertical-align: middle;
}

body.tcf-ws-page .task-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
    counter-reset: ws-task;
}

body.tcf-ws-page .task-list .task-item {
    position: relative;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    column-gap: 10px;
    align-items: center;
    margin: 0;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 12px;
    font-family: var(--ws-font);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ws-ink);
    cursor: pointer;
    counter-increment: ws-task;
    transition: background 0.15s ease, border-color 0.15s ease;
}

body.tcf-ws-page .task-list .task-item::before {
    content: counter(ws-task);
    grid-row: 1 / span 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    font-size: 13px;
    font-weight: 700;
    color: var(--ws-muted);
}

/* Type et fourchette de mots sous le nom de la tâche */
body.tcf-ws-page .task-list .task-item::after {
    grid-column: 2 / span 2;
    grid-row: 2;
    font-size: 11.5px;
    font-weight: 500;
    color: var(--ws-muted);
}

body.tcf-ws-page .task-list .task-item[data-task="0"]::after { content: "Message · 60–120 mots"; }
body.tcf-ws-page .task-list .task-item[data-task="1"]::after { content: "Article · 120–150 mots"; }
body.tcf-ws-page .task-list .task-item[data-task="2"]::after { content: "Argumentation · 120–180 mots"; }

body.tcf-ws-page .task-list .task-item:hover {
    background: var(--ws-soft);
    border-color: #CBD5E1;
}

body.tcf-ws-page .task-list .task-item.active {
    background: var(--ws-blue-soft);
    border-color: #9DBDF3;
    color: var(--ws-navy);
}

body.tcf-ws-page .task-list .task-item.active::before {
    background: var(--ws-blue);
    border-color: var(--ws-blue);
    color: #fff;
}

/* Tâche rédigée dans la fourchette : pastille verte (classes posées par le script) */
body.tcf-ws-page .task-list .task-item.is-ok::before {
    content: "✓";
    background: var(--ws-green-soft);
    border-color: var(--ws-green-line);
    color: var(--ws-green-ink);
}

body.tcf-ws-page .task-list .task-item.active.is-ok::before {
    background: var(--ws-green);
    border-color: var(--ws-green);
    color: #fff;
}

body.tcf-ws-page .task-list .task-item .ws-task-words {
    grid-column: 3;
    grid-row: 1;
    padding: 1px 7px;
    border-radius: 999px;
    background: var(--ws-soft);
    font-size: 11px;
    font-weight: 600;
    color: var(--ws-muted);
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page .task-list .task-item.is-ok .ws-task-words {
    background: var(--ws-green-soft);
    color: var(--ws-green-ink);
}

body.tcf-ws-page .task-list .task-item.is-under .ws-task-words {
    background: var(--ws-amber-soft);
    color: var(--ws-amber-ink);
}

body.tcf-ws-page .task-list .task-item.is-over .ws-task-words {
    background: var(--ws-red-soft);
    color: var(--ws-red-ink);
}

body.tcf-ws-page .sidebar-note {
    margin-top: 12px;
    font-size: 12px;
    font-style: normal;
    line-height: 1.5;
    color: var(--ws-faint);
}

/* Cartes d'état de la colonne de gauche (render_sidebar_status_card, carte Mode libre du script) :
   en-tête (pastille d'icône + libellé), titre avec le chiffre en évidence, texte, bouton pleine largeur.
   Tons : vert = crédits suffisants, ambre = bientôt épuisés, rouge = épuisés, bleu = connexion,
   indigo = mode libre */
body.tcf-ws-page .sidebar.left-sidebar .ws-side-card {
    --card-ink: var(--ws-green-ink);
    --card-soft: var(--ws-green-soft);
    --card-line: var(--ws-green-line);
    --card-btn: var(--card-ink);
    --card-btn-ink: #fff;
    --card-btn-line: var(--card-ink);
    position: relative;
    display: block;
    margin: 16px 0 0;
    padding: 14px;
    background: var(--card-soft);
    border: 1px solid var(--card-line);
    border-radius: 12px;
    box-shadow: none;
    font-family: var(--ws-font);
    font-size: 13px;
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card::before {
    display: none;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card--low {
    --card-ink: var(--ws-amber-ink);
    --card-soft: var(--ws-amber-soft);
    --card-line: var(--ws-amber-line);
    --card-btn: var(--ws-amber-ink);
    --card-btn-ink: #fff;
    --card-btn-line: var(--ws-amber-ink);
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card--empty {
    --card-ink: var(--ws-red-ink);
    --card-soft: var(--ws-red-soft);
    --card-line: var(--ws-red-line);
    --card-btn: #DC2626;
    --card-btn-ink: #fff;
    --card-btn-line: #DC2626;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card--guest {
    --card-ink: var(--ws-blue);
    --card-soft: var(--ws-blue-soft);
    --card-line: var(--ws-blue-line);
    --card-btn: var(--ws-blue);
    --card-btn-ink: #fff;
    --card-btn-line: var(--ws-blue);
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card--free {
    --card-ink: var(--ws-indigo-ink);
    --card-soft: var(--ws-indigo-soft);
    --card-line: var(--ws-indigo-line);
    --card-btn: #fff;
    --card-btn-ink: var(--ws-indigo-ink);
    --card-btn-line: var(--ws-indigo-line);
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card__head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: #fff;
    border: 1px solid var(--card-line);
    border-radius: 8px;
    color: var(--card-ink);
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card__icon svg {
    width: 15px;
    height: 15px;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card__label {
    min-width: 0;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--card-ink);
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card p {
    margin: 0;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-side-card__title {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    color: var(--ws-ink);
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card__title strong {
    margin-right: 2px;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--card-ink);
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-side-card__text {
    margin-top: 6px;
    font-size: 12.5px;
    line-height: 1.55;
    color: var(--ws-slate);
}

/* Bouton pleine largeur (lien de la carte, ou « Modifier les sujets » du mode libre) */
body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-side-card__link,
body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-fm-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 40px;
    margin: 12px 0 0;
    padding: 9px 14px;
    background: var(--card-btn);
    border: 1px solid var(--card-btn-line);
    border-radius: 9px;
    font-family: var(--ws-font);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    color: var(--card-btn-ink);
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, filter 0.15s ease;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-side-card__link::after {
    content: "→";
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-side-card__link:hover,
body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-fm-btn:hover {
    filter: brightness(0.96);
    text-decoration: none;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-fm-btn svg {
    width: 16px;
    height: 16px;
}

body.tcf-ws-page .free-mode-controls {
    display: block;
    margin: 0;
}

/* ═════════════════════════════ Zone de rédaction ═════════════════════════════ */

body.tcf-ws-page .main-layout > .main-content {
    --task: var(--ws-blue);
    --task-soft: var(--ws-blue-soft);
    --task-line: var(--ws-blue-line);
    --task-ink: var(--ws-blue-dark);
    min-height: 0;
    padding: 26px 30px 24px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: var(--ws-radius);
    box-shadow: var(--ws-shadow);
}

body.tcf-ws-page .main-layout > .main-content[data-task="1"] {
    --task: var(--ws-green);
    --task-soft: var(--ws-green-soft);
    --task-line: var(--ws-green-line);
    --task-ink: var(--ws-green-ink);
}

body.tcf-ws-page .main-layout > .main-content[data-task="2"] {
    --task: var(--ws-indigo);
    --task-soft: var(--ws-indigo-soft);
    --task-line: var(--ws-indigo-line);
    --task-ink: var(--ws-indigo-ink);
}

body.tcf-ws-page .content-header {
    margin: 0 0 18px;
    padding: 0 0 16px;
    border-bottom: 1px solid var(--ws-line);
}

body.tcf-ws-page .content-header h2 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 6px;
    font-family: var(--ws-font);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.3;
    text-transform: none;
    color: var(--ws-ink);
}

body.tcf-ws-page .content-header h2::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background: var(--task);
}

body.tcf-ws-page .content-subtitle {
    font-size: 13.5px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.6;
    color: var(--ws-muted);
}

/* Le sujet : encadré teinté à la couleur de la tâche, bordure fine complète */
body.tcf-ws-page .instruction-text {
    margin: 0 0 18px;
    padding: 12px 18px 14px;
    background: var(--task-soft);
    border: 1px solid var(--task-line);
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.65;
    color: #1E293B;
}

body.tcf-ws-page .instruction-text::before {
    content: "Sujet";
    display: block;
    margin-bottom: 4px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.4;
    text-transform: uppercase;
    color: var(--task-ink);
}

/* Documents de la tâche 3 */
body.tcf-ws-page .documents-section {
    margin: 0 0 18px;
}

body.tcf-ws-page .documents-grid {
    gap: 14px;
    margin: 0;
    counter-reset: ws-doc;
}

body.tcf-ws-page .documents-grid .document-card {
    position: relative;
    padding: 16px 18px 18px;
    overflow: hidden;
    background: #FAFAFF;
    border: 1px solid var(--ws-indigo-line);
    border-radius: 12px;
    counter-increment: ws-doc;
}

body.tcf-ws-page .documents-grid .document-card::after {
    content: "\201C";
    position: absolute;
    top: 2px;
    right: 14px;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 60px;
    line-height: 1;
    color: var(--ws-indigo);
    opacity: 0.16;
    pointer-events: none;
}

body.tcf-ws-page .documents-grid .document-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    padding: 0 0 10px;
    border-bottom: 1px dashed var(--ws-indigo-line);
    font-family: var(--ws-font);
    font-size: 13.5px;
    font-weight: 600;
    text-transform: none;
    color: var(--ws-ink);
}

body.tcf-ws-page .documents-grid .document-title::before {
    content: counter(ws-doc);
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--ws-indigo);
    font-size: 11.5px;
    font-weight: 700;
    color: #fff;
}

body.tcf-ws-page .documents-grid .document-content {
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--ws-slate);
}

/* Zone d'écriture (la bordure disparaissait au focus : « border: 2px » sans style) */
body.tcf-ws-page .response-area {
    margin-bottom: 18px;
}

body.tcf-ws-page .text-input,
body.tcf-ws-page .text-input.main-textarea {
    min-height: 340px;
    padding: 18px 20px;
    background: #fff;
    border: 1px solid #CBD5E1;
    border-radius: 12px;
    font-family: var(--ws-font);
    font-size: 16px !important;
    line-height: 1.75;
    color: var(--ws-ink);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.tcf-ws-page .text-input::placeholder {
    font-size: 15px;
    color: var(--ws-faint);
}

body.tcf-ws-page .text-input:focus {
    outline: none;
    border: 1px solid var(--ws-blue);
    box-shadow: 0 0 0 4px rgba(19, 99, 223, 0.12);
}

/* Barre de navigation : compteur de mots + boutons */
body.tcf-ws-page .navigation {
    gap: 14px;
    padding-top: 16px;
    border-top: 1px solid var(--ws-line);
}

/* Compteur de mots : couleur de la tâche affichée */
body.tcf-ws-page .word-counter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    background: var(--task-soft);
    border: 1px solid var(--task-line);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--task-ink);
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page .word-counter::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: var(--task);
}

body.tcf-ws-page .nav-buttons {
    gap: 10px;
}

body.tcf-ws-page .nav-buttons .btn,
body.tcf-ws-page .btn {
    min-height: 44px;
    padding: 10px 18px !important;
    border: 1px solid var(--ws-line);
    border-radius: 10px;
    background: #fff;
    font-family: var(--ws-font);
    font-size: 14px !important;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--ws-slate);
    box-shadow: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body.tcf-ws-page .btn:hover {
    background: var(--ws-soft);
    border-color: #CBD5E1;
    color: var(--ws-ink);
}

body.tcf-ws-page .btn:disabled,
body.tcf-ws-page .btn.opacity-50 {
    opacity: 0.45;
    color: var(--ws-muted);
    cursor: not-allowed;
}

body.tcf-ws-page .btn.btn-primary {
    background: var(--ws-blue-soft);
    border-color: var(--ws-blue-line);
    color: var(--ws-blue);
}

body.tcf-ws-page .btn.btn-primary:hover {
    background: var(--ws-blue);
    border-color: var(--ws-blue);
    color: #fff;
}

body.tcf-ws-page .btn.btn-primary.disabled {
    opacity: 0.45;
}

/* ═════════════════════════════ Colonne d'outils ═════════════════════════════ */

/* Chrono : libellé discret + chiffres lisibles ; orange sous 5 min, rouge sous 1 min */
body.tcf-ws-page .timer {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px;
    padding: 12px 14px;
    background: var(--ws-blue-soft);
    border: 1px solid var(--ws-blue-line);
    border-radius: 12px;
    font-family: var(--ws-font);
    color: var(--ws-navy);
}

body.tcf-ws-page .timer .timer-icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--ws-blue);
}

body.tcf-ws-page .timer .timer-label {
    flex: 1;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--ws-muted);
}

body.tcf-ws-page .timer .timer-value {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1;
    color: var(--ws-navy);
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page .timer.timer-warning {
    background: var(--ws-amber-soft);
    border-color: var(--ws-amber-line);
}

body.tcf-ws-page .timer.timer-warning .timer-icon,
body.tcf-ws-page .timer.timer-warning .timer-value {
    color: var(--ws-amber-ink);
}

body.tcf-ws-page .timer.timer-critical {
    background: var(--ws-red-soft);
    border-color: var(--ws-red-line);
    animation: ws-timer-pulse 1s ease-in-out infinite;
}

body.tcf-ws-page .timer.timer-critical .timer-icon,
body.tcf-ws-page .timer.timer-critical .timer-value {
    color: var(--ws-red-ink);
}

@keyframes ws-timer-pulse {
    50% {
        box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.14);
    }
}

/* Tableau de caractères */
body.tcf-ws-page .character-grid {
    gap: 5px;
    margin: 0 0 18px;
}

body.tcf-ws-page .char-button {
    height: 32px;
    padding: 0;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 7px;
    font-family: var(--ws-font);
    font-size: 14px;
    font-weight: 500;
    color: var(--ws-slate);
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body.tcf-ws-page .char-button:hover {
    background: var(--ws-blue-soft);
    border-color: var(--ws-blue-line);
    color: var(--ws-blue);
}

/* Actions : directement sous le tableau (plus de grand vide), note discrète */
body.tcf-ws-page .download-section {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 0;
    padding-top: 16px;
    border-top: 1px solid var(--ws-line);
}

body.tcf-ws-page .download-section .warning-alert,
body.tcf-ws-page .mobile-download-section .warning-alert {
    order: 9;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--ws-faint);
}

body.tcf-ws-page .download-section .warning-alert::before,
body.tcf-ws-page .mobile-download-section .warning-alert::before {
    width: 14px;
    height: 14px;
    opacity: 0.6;
    filter: grayscale(1);
}

body.tcf-ws-page .btn-download {
    max-width: none;
    min-height: 46px;
    margin: 0;
    padding: 11px 16px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 10px;
    box-shadow: none;
    font-family: var(--ws-font);
    font-size: 14px;
    font-weight: 600;
    color: var(--ws-slate);
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

body.tcf-ws-page .btn-download:hover {
    background: var(--ws-soft);
    border-color: #CBD5E1;
    color: var(--ws-ink) !important;
}

body.tcf-ws-page .btn-download .btn-icon {
    width: 17px;
    height: 17px;
}

/* Action principale : « Corriger maintenant » / « Terminer l'examen » */
body.tcf-ws-page .btn-download.btn-correct {
    order: -1;
    background: var(--ws-blue) !important;
    border-color: var(--ws-blue);
    color: #fff !important;
}

body.tcf-ws-page .btn-download.btn-correct:hover {
    background: var(--ws-blue-dark) !important;
    border-color: var(--ws-blue-dark);
    color: #fff !important;
    transform: translateY(-1px);
}

body.tcf-ws-page .btn-download.btn-correct .tcf-credits-badge {
    margin-left: 6px;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow: none;
    text-shadow: none;
    animation: none;
}

body.tcf-ws-page .btn-download.btn-correct .tcf-credits-badge.tcf-badge-red {
    background: #fff;
    border-color: #fff;
    color: var(--ws-red-ink);
}

body.tcf-ws-page .btn-download.btn-correct .tcf-credits-badge.tcf-badge-orange {
    background: #fff;
    border-color: #fff;
    color: var(--ws-amber-ink);
}

body.tcf-ws-page .btn-download.btn-show-correction {
    background: var(--ws-green);
    border-color: var(--ws-green);
    color: #fff;
}

body.tcf-ws-page .btn-download.btn-show-correction:hover {
    background: var(--ws-green-dark);
    border-color: var(--ws-green-dark);
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: none;
}

body.tcf-ws-page .btn-download.btn-hide-correction {
    background: #fff;
    border-color: var(--ws-line);
    color: var(--ws-slate);
}

body.tcf-ws-page .btn-download.btn-hide-correction:hover {
    transform: none;
    box-shadow: none;
}

/* « Effacer mes textes » : action secondaire discrète, en bas de la zone, rouge au survol */
body.tcf-ws-page .ws-clear-texts {
    order: 10;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 40px;
    margin: 0;
    padding: 8px 14px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    box-shadow: none;
    font-family: var(--ws-font);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--ws-muted);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body.tcf-ws-page .ws-clear-texts .btn-icon {
    width: 16px;
    height: 16px;
}

body.tcf-ws-page .ws-clear-texts:hover:not(:disabled),
body.tcf-ws-page .ws-clear-texts:focus-visible {
    background: var(--ws-red-soft);
    border-color: var(--ws-red-line);
    color: var(--ws-red-ink);
}

body.tcf-ws-page .ws-clear-texts:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

/* Section mobile (sous la zone de rédaction) */
body.tcf-ws-page .mobile-download-section {
    flex-direction: column;
    gap: 10px;
    padding: 16px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: var(--ws-radius);
}

/* Bandeau « mode Examen Blanc » */
body.tcf-ws-page .tcf-eb-ee-banner {
    gap: 10px;
    margin: 0 0 18px;
    padding: 12px 16px;
    background: var(--ws-blue-soft);
    border: 1px solid var(--ws-blue-line);
    border-radius: 12px;
    font-size: 14px;
    color: var(--ws-navy);
}

body.tcf-ws-page .tcf-eb-ee-banner::before {
    content: "";
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: var(--ws-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z'/%3E%3Cline x1='4' y1='22' x2='4' y2='15'/%3E%3C/svg%3E") center / 15px no-repeat;
}

/* Barre d'actions flottante (« Revenir à l'éditeur », ou « Voir la correction » / « Corriger maintenant »
   dans l'éditeur) : pastille blanche compacte en bas au centre, toujours à portée de main, au lieu de la
   bande sombre pleine largeur de correction-interface.css qui recouvrait le contenu. Sur l'écran des
   résultats, elle s'efface tant que le bouton de l'en-tête est visible (classe ws-bar-away, posée par
   simulator__script.js). Le JS règle display (flex / none) en ligne. */
body.tcf-ws-page .buttons__bloc {
    position: fixed;
    left: 50%;
    right: auto;
    bottom: 20px;
    z-index: 999;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 8px;
    width: auto;
    max-width: calc(100% - 32px);
    margin: 0;
    padding: 8px;
    background: rgba(255, 255, 255, 0.94);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 1px solid var(--ws-line);
    border-radius: 14px;
    box-shadow: 0 8px 32px rgba(15, 23, 42, 0.16);
    transform: translateX(-50%);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

body.tcf-ws-page .buttons__bloc.ws-bar-away {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 16px);
}

/* Petit écran : calée à gauche, pour laisser la place au bouton WhatsApp flottant (en bas à droite) */
@media (max-width: 480px) {
    body.tcf-ws-page .buttons__bloc {
        left: 16px;
        bottom: 16px;
        max-width: calc(100% - 104px);
        transform: none;
    }

    body.tcf-ws-page .buttons__bloc.ws-bar-away {
        transform: translateY(16px);
    }
}

body.tcf-ws-page .buttons__bloc .btn-download {
    width: auto;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 10px 18px;
    white-space: nowrap;
}

/* « Revenir à l'éditeur » / « Voir la correction » : action principale de la barre */
body.tcf-ws-page .buttons__bloc .btn-navigation {
    background: var(--ws-blue);
    border-color: var(--ws-blue);
    color: #fff;
}

body.tcf-ws-page .buttons__bloc .btn-navigation:hover {
    background: var(--ws-blue-dark);
    border-color: var(--ws-blue-dark);
    color: #fff !important;
}

/* À côté de « Corriger maintenant », « Voir la correction » redevient secondaire */
body.tcf-ws-page .buttons__bloc:has(#btn-correct-modified:not([style*="none"])) .btn-navigation {
    background: #fff;
    border-color: var(--ws-blue-line);
    color: var(--ws-blue);
}

body.tcf-ws-page .buttons__bloc:has(#btn-correct-modified:not([style*="none"])) .btn-navigation:hover {
    background: var(--ws-blue-soft);
    color: var(--ws-blue) !important;
}

/* Résultats : de la place sous le contenu pour que la barre flottante ne cache pas la fin de page */
body.tcf-ws-page.ws-results-view .simulator__container {
    padding-bottom: 96px;
}

/* ═════════════════════════════ Fenêtres (modèle unique) ═════════════════════════════ */

/* Voiles */
body.tcf-ws-page .tcf-popup-overlay.tcf-credits-popup,
body.tcf-ws-page .correction-popup-overlay,
body.tcf-ws-page #tcf-free-mode-popup,
body.tcf-ws-page .fm-exit-overlay,
body.tcf-ws-page .tcf-pdf-limit-overlay {
    background: rgba(15, 23, 42, 0.55);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

/* Cadres */
body.tcf-ws-page .tcf-popup-overlay .tcf-popup-container,
body.tcf-ws-page .correction-popup-overlay .correction-popup-container,
body.tcf-ws-page .fm-exit-overlay .fm-exit-content,
body.tcf-ws-page .tcf-pdf-limit-overlay .tcf-pdf-limit-modal {
    width: calc(100% - 32px);
    max-width: 460px;
    padding: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 16px;
    box-shadow: var(--ws-shadow-modal);
    font-family: var(--ws-font);
    text-align: left;
}

body.tcf-ws-page .correction-popup-overlay .correction-popup-container {
    max-width: 480px !important;
}

/* En-têtes : pastille d'icône, titre, bouton de fermeture */
body.tcf-ws-page .tcf-popup-overlay .tcf-popup-header,
body.tcf-ws-page .correction-popup-overlay .tcf-popup-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0;
    padding: 22px 24px 10px;
    background: none;
    border: 0;
    text-align: left;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-icon,
body.tcf-ws-page .correction-popup-overlay .tcf-popup-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    border: 1px solid var(--ws-blue-line);
    border-radius: 12px;
    background: var(--ws-blue-soft) !important;
    color: var(--ws-blue) !important;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-icon svg,
body.tcf-ws-page .correction-popup-overlay .tcf-popup-icon svg {
    width: 22px;
    height: 22px;
}

/* Couleur de l'icône selon la nature de la fenêtre */
body.tcf-ws-page .tcf-popup-no-credits .tcf-popup-icon {
    background: var(--ws-red-soft) !important;
    border-color: var(--ws-red-line);
    color: var(--ws-red) !important;
}

body.tcf-ws-page .tcf-popup-low-credits .tcf-popup-icon,
body.tcf-ws-page .tcf-popup-task-size-issues .tcf-popup-icon,
body.tcf-ws-page .tcf-popup-partial-submission .tcf-popup-icon {
    background: var(--ws-amber-soft) !important;
    border-color: var(--ws-amber-line);
    color: var(--ws-amber-ink) !important;
}

body.tcf-ws-page #whatsapp-testimonial-popup .tcf-popup-icon {
    background: var(--ws-green-soft) !important;
    border-color: var(--ws-green-line);
    color: var(--ws-green-ink) !important;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-header h3,
body.tcf-ws-page .correction-popup-overlay .tcf-popup-header h3 {
    flex: 1;
    margin: 0;
    font-family: var(--ws-font);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.3;
    color: var(--ws-ink);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-close,
body.tcf-ws-page .correction-popup-overlay .tcf-popup-close {
    position: static;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: -6px -8px 0 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 50%;
    color: var(--ws-faint);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-close:hover,
body.tcf-ws-page .correction-popup-overlay .tcf-popup-close:hover {
    background: var(--ws-page);
    color: var(--ws-ink);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-close svg,
body.tcf-ws-page .correction-popup-overlay .tcf-popup-close svg {
    width: 18px;
    height: 18px;
}

/* Corps */
body.tcf-ws-page .tcf-popup-overlay .tcf-popup-content,
body.tcf-ws-page .correction-popup-overlay .correction-popup-body {
    padding: 6px 24px 4px;
    text-align: left;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-message,
body.tcf-ws-page .correction-popup-overlay .popup-message {
    margin: 0 0 10px;
    font-family: var(--ws-font);
    font-size: 14.5px;
    font-weight: 400;
    line-height: 1.65;
    text-align: left;
    color: var(--ws-slate);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-message strong,
body.tcf-ws-page .correction-popup-overlay .popup-message strong,
body.tcf-ws-page .tcf-credits-count {
    font-weight: 600;
    color: var(--ws-ink);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-content ul {
    margin: 10px 0;
    padding: 0;
    list-style: none;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-content li {
    margin: 0 0 8px;
    padding: 10px 12px;
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    border-radius: 10px;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--ws-slate);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-checkbox,
body.tcf-ws-page .correction-popup-overlay .correction-popup-checkbox {
    margin: 6px 0 4px;
    padding: 0;
    text-align: left;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-checkbox label,
body.tcf-ws-page .correction-popup-overlay .correction-popup-checkbox label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--ws-font);
    font-size: 13.5px;
    font-weight: 500;
    color: var(--ws-muted);
    cursor: pointer;
}

body.tcf-ws-page .tcf-popup-overlay input[type="checkbox"],
body.tcf-ws-page .correction-popup-overlay input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--ws-blue);
}

/* Actions */
body.tcf-ws-page .tcf-popup-overlay .tcf-popup-actions,
body.tcf-ws-page .correction-popup-overlay .correction-popup-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    margin: 0;
    padding: 16px 24px 22px;
    background: none;
    border: 0;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn,
body.tcf-ws-page .correction-popup-overlay .popup-btn,
body.tcf-ws-page .correction-popup-overlay .tcf-feedback-submit-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    min-width: 120px;
    min-height: 44px;
    margin: 0;
    padding: 10px 18px;
    border: 1px solid transparent;
    border-radius: 10px;
    box-shadow: none;
    font-family: var(--ws-font);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn svg,
body.tcf-ws-page .correction-popup-overlay .popup-btn svg {
    width: 16px;
    height: 16px;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-secondary,
body.tcf-ws-page .correction-popup-overlay .popup-btn-cancel {
    background: #fff;
    border-color: var(--ws-line);
    color: var(--ws-slate);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-secondary:hover,
body.tcf-ws-page .correction-popup-overlay .popup-btn-cancel:hover {
    background: var(--ws-soft);
    border-color: #CBD5E1;
    color: var(--ws-ink);
    transform: none;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-primary,
body.tcf-ws-page .correction-popup-overlay .popup-btn-confirm,
body.tcf-ws-page .correction-popup-overlay .tcf-feedback-submit-btn {
    background: var(--ws-blue);
    border-color: var(--ws-blue);
    color: #fff;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-primary:hover,
body.tcf-ws-page .correction-popup-overlay .popup-btn-confirm:hover,
body.tcf-ws-page .correction-popup-overlay .tcf-feedback-submit-btn:hover {
    background: var(--ws-blue-dark);
    border-color: var(--ws-blue-dark);
    color: #fff;
    transform: translateY(-1px);
}

body.tcf-ws-page #whatsapp-testimonial-popup .popup-btn-confirm {
    background: var(--ws-green);
    border-color: var(--ws-green);
}

body.tcf-ws-page #whatsapp-testimonial-popup .popup-btn-confirm:hover {
    background: var(--ws-green-dark);
    border-color: var(--ws-green-dark);
}

/* Fenêtre à un seul bouton (« Fermer ») : bouton pleine largeur */
body.tcf-ws-page .tcf-popup-task-size-issues .tcf-popup-actions .tcf-popup-btn {
    flex: 1 1 auto;
}

/* Focus : anneau sur le bouton au clavier, pas de cadre bleu autour de toute la fenêtre
   (règle :focus-within de credits-unified.css) */
body.tcf-ws-page .tcf-popup-container:focus-within {
    outline: none;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn:focus:not(:focus-visible) {
    outline: none;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn:focus-visible {
    outline: 2px solid var(--ws-blue);
    outline-offset: 2px;
}

/* Effacer mes textes : icône et bouton de confirmation en rouge */
body.tcf-ws-page .tcf-popup-clear-texts .tcf-popup-icon {
    background: var(--ws-red-soft) !important;
    border-color: var(--ws-red-line);
    color: var(--ws-red-ink) !important;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-danger {
    background: #DC2626;
    border-color: #DC2626;
    color: #fff;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-danger:hover {
    background: var(--ws-red-ink);
    border-color: var(--ws-red-ink);
    color: #fff;
    transform: translateY(-1px);
}

body.tcf-ws-page #clear-texts-popup .ws-clear-note {
    margin: 0;
    padding: 10px 12px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ws-muted);
}

/* Examen blanc, chrono écoulé (openTimeUpSubmitPopup) : icône ambre, récapitulatif des tâches,
   un seul bouton « Soumettre ma copie » pleine largeur (fenêtre bloquante, sans croix) */
body.tcf-ws-page .tcf-popup-time-up .tcf-popup-icon {
    background: var(--ws-amber-soft) !important;
    border-color: var(--ws-amber-line);
    color: var(--ws-amber-ink) !important;
}

body.tcf-ws-page #time-up-popup .tcf-popup-message {
    margin: 0 0 14px;
}

body.tcf-ws-page #time-up-popup .ws-partial-tasks {
    margin-bottom: 0;
}

body.tcf-ws-page #time-up-popup .tcf-popup-actions .tcf-popup-btn {
    flex: 1;
    justify-content: center;
}

/* Copie corrigée rechargée (openCorrectedDraftPopup) : icône verte, encadré « Mes travaux »,
   « effacer vos textes » en lien discret dans la phrase (rouge au survol, comme dans la colonne d'outils) */
body.tcf-ws-page .tcf-popup-corrected-draft .tcf-popup-icon {
    background: var(--ws-green-soft) !important;
    border-color: var(--ws-green-line);
    color: var(--ws-green-ink) !important;
}

body.tcf-ws-page #corrected-draft-popup .ws-corrected-note {
    margin: 0;
    padding: 10px 12px;
    background: var(--ws-green-soft);
    border: 1px solid var(--ws-green-line);
    border-radius: 10px;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--ws-slate);
}

body.tcf-ws-page #corrected-draft-popup .ws-corrected-note strong {
    font-weight: 600;
    color: var(--ws-ink);
}

body.tcf-ws-page #corrected-draft-popup a.tcf-popup-btn,
body.tcf-ws-page #corrected-draft-popup a.tcf-popup-btn:hover,
body.tcf-ws-page #corrected-draft-popup a.tcf-popup-btn:focus {
    color: #fff;
    text-decoration: none;
}

body.tcf-ws-page #corrected-draft-popup .ws-inline-link {
    display: inline;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    font: inherit;
    color: var(--ws-slate);
    text-decoration: underline;
    text-decoration-color: var(--ws-faint);
    text-underline-offset: 2px;
    cursor: pointer;
    transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

body.tcf-ws-page #corrected-draft-popup .ws-inline-link:hover {
    color: #DC2626;
    text-decoration-color: #DC2626;
}

/* Mobile : boutons empilés pleine largeur, « Voir la correction précédente » en haut */
body.tcf-ws-page #corrected-draft-popup .tcf-popup-actions {
    flex-direction: column-reverse;
}

body.tcf-ws-page #corrected-draft-popup .tcf-popup-actions .tcf-popup-btn {
    width: 100%;
}

@media (min-width: 520px) {
    body.tcf-ws-page #corrected-draft-popup .tcf-popup-actions {
        flex-direction: row;
    }

    body.tcf-ws-page #corrected-draft-popup .tcf-popup-actions .tcf-popup-btn {
        width: auto;
    }
}

/* Essais bientôt épuisés / épuisés (tcf-credits-unified.js) : solde en évidence,
   bouton « Renouveler sur WhatsApp » vert comme les autres actions WhatsApp du simulateur */
body.tcf-ws-page .tcf-popup-overlay .tcf-renew-balance {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin: 4px 0 14px;
    padding: 12px 14px;
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    border-radius: 12px;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-renew-balance__count {
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--ws-amber-ink);
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page .tcf-popup-overlay .tcf-renew-balance__label {
    flex: 0 1 auto;
    min-width: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    color: var(--ws-ink);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-renew-balance__chip {
    flex-shrink: 0;
    margin-left: auto;
    padding: 3px 9px;
    background: #fff;
    border: 1px solid var(--ws-amber-line);
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
    color: var(--ws-amber-ink);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-whatsapp {
    background: var(--ws-green);
    border-color: var(--ws-green);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-whatsapp:hover {
    background: var(--ws-green-dark);
    border-color: var(--ws-green-dark);
}

body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn-whatsapp svg {
    width: 18px;
    height: 18px;
}

/* Mobile : boutons empilés pleine largeur, action principale en haut */
body.tcf-ws-page .tcf-popup-low-credits .tcf-popup-actions,
body.tcf-ws-page .tcf-popup-no-credits .tcf-popup-actions {
    flex-direction: column-reverse;
}

body.tcf-ws-page .tcf-popup-low-credits .tcf-popup-actions .tcf-popup-btn,
body.tcf-ws-page .tcf-popup-no-credits .tcf-popup-actions .tcf-popup-btn {
    width: 100%;
}

@media (min-width: 520px) {
    body.tcf-ws-page .tcf-popup-low-credits .tcf-popup-actions,
    body.tcf-ws-page .tcf-popup-no-credits .tcf-popup-actions {
        flex-direction: row;
    }

    body.tcf-ws-page .tcf-popup-low-credits .tcf-popup-actions .tcf-popup-btn,
    body.tcf-ws-page .tcf-popup-no-credits .tcf-popup-actions .tcf-popup-btn {
        width: auto;
    }
}

/* Avis (note de 1 à 10) */
body.tcf-ws-page .correction-popup-overlay .tcf-feedback-rating {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    gap: 6px;
}

body.tcf-ws-page .correction-popup-overlay .tcf-rating-btn {
    height: 38px;
    padding: 0;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 8px;
    font-family: var(--ws-font);
    font-size: 14px;
    font-weight: 600;
    color: var(--ws-slate);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body.tcf-ws-page .correction-popup-overlay .tcf-rating-btn:hover,
body.tcf-ws-page .correction-popup-overlay .tcf-rating-btn.selected,
body.tcf-ws-page .correction-popup-overlay .tcf-rating-btn.active {
    background: var(--ws-blue);
    border-color: var(--ws-blue);
    color: #fff;
}

body.tcf-ws-page .correction-popup-overlay .tcf-feedback-textarea {
    width: 100%;
    min-height: 96px;
    padding: 12px 14px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 10px;
    font-family: var(--ws-font);
    font-size: 14px;
    color: var(--ws-ink);
}

body.tcf-ws-page .correction-popup-overlay .tcf-feedback-textarea:focus {
    outline: none;
    background: #fff;
    border-color: var(--ws-blue);
    box-shadow: 0 0 0 4px rgba(19, 99, 223, 0.12);
}

/* ── Soumission partielle et confirmation : état de chaque tâche, essai utilisé ── */
body.tcf-ws-page #partial-submission-popup .tcf-popup-container {
    max-width: 480px;
}

body.tcf-ws-page #partial-submission-popup .ws-partial-lead,
body.tcf-ws-page #exam-submit-popup .ws-partial-lead,
body.tcf-ws-page #time-up-popup .ws-partial-lead,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-lead {
    margin: 0 0 14px;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--ws-slate);
}

body.tcf-ws-page #partial-submission-popup .ws-partial-lead strong,
body.tcf-ws-page #exam-submit-popup .ws-partial-lead strong,
body.tcf-ws-page #time-up-popup .ws-partial-lead strong,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-lead strong {
    font-weight: 600;
    color: var(--ws-ink);
}

body.tcf-ws-page #partial-submission-popup .ws-partial-tasks,
body.tcf-ws-page #exam-submit-popup .ws-partial-tasks,
body.tcf-ws-page #time-up-popup .ws-partial-tasks,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-tasks {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
}

body.tcf-ws-page #partial-submission-popup .ws-partial-task,
body.tcf-ws-page #exam-submit-popup .ws-partial-task,
body.tcf-ws-page #time-up-popup .ws-partial-task,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-task {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 10px;
    list-style: none;
}

body.tcf-ws-page #partial-submission-popup .ws-partial-task.is-done,
body.tcf-ws-page #exam-submit-popup .ws-partial-task.is-done,
body.tcf-ws-page #time-up-popup .ws-partial-task.is-done,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-task.is-done {
    background: var(--ws-green-soft);
    border-color: var(--ws-green-line);
}

body.tcf-ws-page #partial-submission-popup .ws-partial-mark,
body.tcf-ws-page #exam-submit-popup .ws-partial-mark,
body.tcf-ws-page #time-up-popup .ws-partial-mark,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-mark {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--ws-faint);
}

body.tcf-ws-page #partial-submission-popup .is-done .ws-partial-mark,
body.tcf-ws-page #exam-submit-popup .is-done .ws-partial-mark,
body.tcf-ws-page #time-up-popup .is-done .ws-partial-mark,
body.tcf-ws-page #correction-confirmation-popup .is-done .ws-partial-mark {
    background: var(--ws-green);
    border-color: var(--ws-green);
    color: #fff;
}

body.tcf-ws-page #partial-submission-popup .ws-partial-name,
body.tcf-ws-page #exam-submit-popup .ws-partial-name,
body.tcf-ws-page #time-up-popup .ws-partial-name,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-name {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ws-ink);
}

body.tcf-ws-page #partial-submission-popup .is-empty .ws-partial-name,
body.tcf-ws-page #correction-confirmation-popup .is-empty .ws-partial-name {
    color: var(--ws-muted);
}

body.tcf-ws-page #partial-submission-popup .ws-partial-name small,
body.tcf-ws-page #exam-submit-popup .ws-partial-name small,
body.tcf-ws-page #time-up-popup .ws-partial-name small,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-name small {
    font-size: 12px;
    font-weight: 500;
    color: var(--ws-muted);
}

body.tcf-ws-page #partial-submission-popup .ws-partial-chip,
body.tcf-ws-page #exam-submit-popup .ws-partial-chip,
body.tcf-ws-page #time-up-popup .ws-partial-chip,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-chip {
    flex-shrink: 0;
    padding: 2px 9px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--ws-muted);
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page #partial-submission-popup .is-done .ws-partial-chip,
body.tcf-ws-page #exam-submit-popup .is-done .ws-partial-chip,
body.tcf-ws-page #time-up-popup .is-done .ws-partial-chip,
body.tcf-ws-page #correction-confirmation-popup .is-done .ws-partial-chip {
    background: #fff;
    border-color: var(--ws-green-line);
    color: var(--ws-green-ink);
}

body.tcf-ws-page #partial-submission-popup .ws-partial-credit,
body.tcf-ws-page #exam-submit-popup .ws-partial-credit,
body.tcf-ws-page #time-up-popup .ws-partial-credit,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-credit {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 10px 12px;
    background: var(--ws-blue-soft);
    border: 1px solid var(--ws-blue-line);
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ws-slate);
}

body.tcf-ws-page #partial-submission-popup .ws-partial-credit::before,
body.tcf-ws-page #exam-submit-popup .ws-partial-credit::before,
body.tcf-ws-page #time-up-popup .ws-partial-credit::before,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-credit::before {
    content: "";
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231363DF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='M18.09 10.37A6 6 0 1 1 10.34 18'/%3E%3Cpath d='M7 6h1v4'/%3E%3Cpath d='m16.71 13.88.7.71-2.82 2.82'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.tcf-ws-page #partial-submission-popup .ws-partial-credit strong,
body.tcf-ws-page #exam-submit-popup .ws-partial-credit strong,
body.tcf-ws-page #time-up-popup .ws-partial-credit strong,
body.tcf-ws-page #correction-confirmation-popup .ws-partial-credit strong {
    font-weight: 600;
    color: var(--ws-blue-dark);
}

/* ── Confirmation : récapitulatif des tâches (styles partagés ci-dessus) ── */
body.tcf-ws-page #correction-confirmation-popup .popup-message {
    margin: 0 0 14px;
}

body.tcf-ws-page #correction-confirmation-popup .ws-confirm-recap {
    margin: 0 0 14px;
}

/* ── Examen blanc : confirmation de « Terminer l'examen » (openExamSubmitConfirmPopup, 2026-10-12) ──
   Récapitulatif partagé ci-dessus ; en plus : tâche sous le minimum de mots (ambre), alerte du nombre
   de tâches notées, temps restant. */
body.tcf-ws-page #exam-submit-popup .tcf-popup-container {
    max-width: 480px;
}

body.tcf-ws-page #exam-submit-popup .is-empty .ws-partial-name {
    color: var(--ws-muted);
}

body.tcf-ws-page #exam-submit-popup .ws-partial-task.is-short {
    background: var(--ws-amber-soft);
    border-color: var(--ws-amber-line);
}

body.tcf-ws-page #exam-submit-popup .is-short .ws-partial-mark {
    background: var(--ws-amber);
    border-color: var(--ws-amber);
    color: #fff;
}

body.tcf-ws-page #exam-submit-popup .is-short .ws-partial-chip {
    background: #fff;
    border-color: var(--ws-amber-line);
    color: var(--ws-amber-ink);
}

body.tcf-ws-page #exam-submit-popup .ws-exam-warn,
body.tcf-ws-page #exam-submit-popup .ws-exam-time {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 14px;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 13.5px;
    line-height: 1.5;
}

body.tcf-ws-page #exam-submit-popup .ws-exam-warn {
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    color: var(--ws-amber-ink);
}

body.tcf-ws-page #exam-submit-popup .ws-exam-time {
    margin: 0;
    background: var(--ws-blue-soft);
    border: 1px solid var(--ws-blue-line);
    color: var(--ws-slate);
}

body.tcf-ws-page #exam-submit-popup .ws-exam-warn strong {
    font-weight: 700;
}

body.tcf-ws-page #exam-submit-popup .ws-exam-time strong {
    font-weight: 600;
    color: var(--ws-blue-dark);
}

body.tcf-ws-page #exam-submit-popup .ws-exam-warn::before,
body.tcf-ws-page #exam-submit-popup .ws-exam-time::before {
    content: "";
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 1px;
}

/* Triangle d'alerte ambre */
body.tcf-ws-page #exam-submit-popup .ws-exam-warn::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Horloge bleue */
body.tcf-ws-page #exam-submit-popup .ws-exam-time::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231363DF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (max-width: 480px) {
    body.tcf-ws-page #exam-submit-popup .tcf-popup-actions {
        flex-direction: column-reverse;
    }

    body.tcf-ws-page #exam-submit-popup .tcf-popup-actions .tcf-popup-btn {
        width: 100%;
        justify-content: center;
    }
}

/* ── Limite de mots : une ligne par tâche (mots actuels, fourchette, écart, jauge) ──
   Rouge = trop long, ambre = trop court */
body.tcf-ws-page #task-size-issues-popup .tcf-popup-container {
    max-width: 480px;
}

body.tcf-ws-page #task-size-issues-popup .ws-size-lead {
    margin: 0 0 14px;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--ws-slate);
}

body.tcf-ws-page #task-size-issues-popup .ws-size-lead strong {
    font-weight: 600;
    color: var(--ws-ink);
}

body.tcf-ws-page #task-size-issues-popup .ws-size-tasks {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
}

body.tcf-ws-page #task-size-issues-popup .ws-size-task {
    --size-ink: var(--ws-red-ink);
    --size-dot: var(--ws-red);
    --size-soft: var(--ws-red-soft);
    --size-line: var(--ws-red-line);
    margin: 0;
    padding: 12px 14px 14px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 10px;
    list-style: none;
}

body.tcf-ws-page #task-size-issues-popup .ws-size-task.is-under {
    --size-ink: var(--ws-amber-ink);
    --size-dot: var(--ws-amber);
    --size-soft: var(--ws-amber-soft);
    --size-line: var(--ws-amber-line);
}

body.tcf-ws-page #task-size-issues-popup .ws-size-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

body.tcf-ws-page #task-size-issues-popup .ws-size-mark {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: var(--size-soft);
    border: 1px solid var(--size-line);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--size-ink);
}

body.tcf-ws-page #task-size-issues-popup .ws-size-name {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ws-ink);
}

body.tcf-ws-page #task-size-issues-popup .ws-size-name small,
body.tcf-ws-page #task-size-issues-popup .ws-size-count small {
    font-size: 12px;
    font-weight: 500;
    color: var(--ws-muted);
}

body.tcf-ws-page #task-size-issues-popup .ws-size-count {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
    line-height: 1.3;
    text-align: right;
}

body.tcf-ws-page #task-size-issues-popup .ws-size-count strong {
    font-size: 14px;
    font-weight: 700;
    color: var(--size-ink);
    font-variant-numeric: tabular-nums;
}

/* Jauge : piste grise, fourchette attendue en vert, point = nombre de mots actuel */
body.tcf-ws-page #task-size-issues-popup .ws-size-gauge {
    position: relative;
    height: 6px;
    margin: 12px 0 0 40px;
    background: var(--ws-page);
    border-radius: 999px;
}

body.tcf-ws-page #task-size-issues-popup .ws-size-zone {
    position: absolute;
    top: 0;
    bottom: 0;
    background: rgba(18, 187, 106, 0.4);
    border-radius: 999px;
}

body.tcf-ws-page #task-size-issues-popup .ws-size-dot {
    position: absolute;
    top: 50%;
    width: 12px;
    height: 12px;
    margin: -6px 0 0 -6px;
    background: var(--size-dot);
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 1px var(--size-dot);
}

body.tcf-ws-page #task-size-issues-popup .ws-size-note {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ws-muted);
}

/* ── Mode libre : configuration des sujets ── */
body.tcf-ws-page #tcf-free-mode-popup .tcf-popup-content {
    max-width: 820px;
    border: 1px solid var(--ws-line);
    border-radius: 16px;
    box-shadow: var(--ws-shadow-modal);
    font-family: var(--ws-font);
}

body.tcf-ws-page #tcf-free-mode-popup .tcf-popup-header {
    padding: 22px 28px;
    border-bottom: 1px solid var(--ws-line);
}

body.tcf-ws-page #tcf-free-mode-popup .tcf-ph-text h3 {
    font-family: var(--ws-font);
    font-size: 19px;
    font-weight: 600;
    color: var(--ws-ink);
}

body.tcf-ws-page #tcf-free-mode-popup .tcf-ph-text p {
    font-family: var(--ws-font);
    font-size: 13.5px;
    color: var(--ws-muted);
}

body.tcf-ws-page #tcf-free-mode-popup .tcf-popup-body {
    padding: 22px 28px;
    background: var(--ws-page);
}

body.tcf-ws-page #tcf-free-mode-popup .fm-task-box {
    padding: 18px 20px;
    border: 1px solid var(--ws-line);
    border-radius: 12px;
    box-shadow: none;
}

body.tcf-ws-page #tcf-free-mode-popup .fm-task-header {
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--ws-line);
}

body.tcf-ws-page #tcf-free-mode-popup .fm-task-title {
    font-family: var(--ws-font);
    font-size: 15px;
    color: var(--ws-ink);
}

body.tcf-ws-page #tcf-free-mode-popup .fm-task-icon {
    width: 32px;
    height: 32px;
    border-radius: 9px;
}

body.tcf-ws-page #tcf-free-mode-popup .icon-t1 { background: var(--ws-blue-soft); color: var(--ws-blue); }
body.tcf-ws-page #tcf-free-mode-popup .icon-t2 { background: var(--ws-green-soft); color: var(--ws-green-ink); }
body.tcf-ws-page #tcf-free-mode-popup .icon-t3 { background: var(--ws-indigo-soft); color: var(--ws-indigo); }

body.tcf-ws-page #tcf-free-mode-popup .fm-task-badge {
    padding: 3px 10px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 999px;
    font-size: 11.5px;
    color: var(--ws-slate);
}

body.tcf-ws-page #tcf-free-mode-popup .fm-label {
    font-family: var(--ws-font);
    font-size: 13px;
    font-weight: 500;
    color: var(--ws-slate);
}

body.tcf-ws-page #tcf-free-mode-popup .fm-input {
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 10px;
    font-family: var(--ws-font);
    font-size: 14px;
}

body.tcf-ws-page #tcf-free-mode-popup .fm-input:focus {
    background: #fff;
    border-color: var(--ws-blue);
    box-shadow: 0 0 0 4px rgba(19, 99, 223, 0.12);
}

body.tcf-ws-page #tcf-free-mode-popup .fm-footer {
    padding: 16px 28px 20px;
    border-top: 1px solid var(--ws-line);
}

body.tcf-ws-page #tcf-free-mode-popup .fm-btn {
    min-height: 44px;
    padding: 10px 20px;
    border-radius: 10px;
    font-family: var(--ws-font);
    font-size: 14px;
    font-weight: 600;
}

body.tcf-ws-page #tcf-free-mode-popup .fm-btn-cancel {
    background: #fff;
    border: 1px solid var(--ws-line);
    color: var(--ws-slate);
}

body.tcf-ws-page #tcf-free-mode-popup .fm-btn-save {
    background: var(--ws-blue);
    box-shadow: none;
}

body.tcf-ws-page #tcf-free-mode-popup .fm-btn-save:hover {
    background: var(--ws-blue-dark);
    box-shadow: none;
}

/* ── Mode libre : sortie sans sujets ── */
body.tcf-ws-page .fm-exit-overlay .fm-exit-content {
    padding: 26px 24px 22px;
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-header-row {
    justify-content: flex-start;
    gap: 14px;
    margin-bottom: 12px;
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-icon {
    width: 44px;
    height: 44px;
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    border-radius: 12px;
    color: var(--ws-amber-ink);
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-title {
    font-family: var(--ws-font);
    font-size: 18px;
    font-weight: 600;
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-desc {
    font-family: var(--ws-font);
    font-size: 14.5px;
    text-align: left;
    color: var(--ws-slate);
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-tip {
    background: var(--ws-blue-soft);
    border: 1px solid var(--ws-blue-line);
    border-radius: 10px;
    color: var(--ws-slate);
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-buttons {
    justify-content: flex-end;
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-btn-cancel,
body.tcf-ws-page .fm-exit-overlay .fm-exit-btn-save {
    min-height: 44px;
    border-radius: 10px;
    font-family: var(--ws-font);
    font-size: 14px;
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-btn-save {
    background: var(--ws-blue);
    box-shadow: none;
}

body.tcf-ws-page .fm-exit-overlay .fm-exit-btn-save:hover {
    background: var(--ws-blue-dark);
    box-shadow: none;
}

/* ── Limite de téléchargements PDF ── */
body.tcf-ws-page .tcf-pdf-limit-modal__header {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    padding: 22px 24px 10px;
    background: none;
    border: 0;
    text-align: left;
}

body.tcf-ws-page .tcf-pdf-limit-modal__icon {
    order: -1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    border-radius: 12px;
    font-size: 20px;
}

body.tcf-ws-page .tcf-pdf-limit-modal__title {
    flex: 1;
    margin: 0;
    font-family: var(--ws-font);
    font-size: 18px;
    font-weight: 600;
    color: var(--ws-ink);
}

body.tcf-ws-page .tcf-pdf-limit-modal__close {
    position: static;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: transparent;
    color: var(--ws-faint);
}

body.tcf-ws-page .tcf-pdf-limit-modal__body {
    padding: 6px 24px 22px;
    text-align: left;
}

body.tcf-ws-page .tcf-pdf-limit-modal__message {
    font-family: var(--ws-font);
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--ws-slate);
}

body.tcf-ws-page .tcf-pdf-limit-modal__warning {
    padding: 10px 12px;
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    border-radius: 10px;
    font-size: 13px;
    color: var(--ws-amber-ink);
}

body.tcf-ws-page .tcf-pdf-limit-modal__actions {
    justify-content: flex-end;
    gap: 10px;
}

body.tcf-ws-page .tcf-pdf-limit-modal__cta,
body.tcf-ws-page .tcf-pdf-limit-modal__login {
    min-height: 44px;
    border-radius: 10px;
    font-family: var(--ws-font);
    font-size: 14px;
    font-weight: 600;
}

body.tcf-ws-page .tcf-pdf-limit-modal__cta {
    background: var(--ws-blue);
    color: #fff;
}

body.tcf-ws-page .tcf-pdf-limit-modal__login {
    background: #fff;
    border: 1px solid var(--ws-line);
    color: var(--ws-slate);
}

/* ═════════════════════════════ Notifications ═════════════════════════════ */

/* Pile de notifications (showAlert) : en haut à droite, sous la barre d'admin */
.tcf-ws-toasts {
    position: fixed;
    top: calc(var(--wp-admin--admin-bar--height, 0px) + 20px);
    right: 20px;
    z-index: 1000001;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: min(380px, calc(100vw - 32px));
    pointer-events: none;
}

.tcf-ws-toast {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 12px 12px 14px;
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: #0F172A;
    pointer-events: auto;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.tcf-ws-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.tcf-ws-toast__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
}

.tcf-ws-toast__text {
    flex: 1;
    min-width: 0;
    padding-top: 5px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    color: #334155;
}

.tcf-ws-toast__close {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 50%;
    font-size: 18px;
    line-height: 1;
    color: #94A3B8;
    cursor: pointer;
}

.tcf-ws-toast__close:hover {
    background: #F1F5F9;
    color: #0F172A;
}

.tcf-ws-toast--success .tcf-ws-toast__icon { background: #ECFDF5; color: #047857; }
.tcf-ws-toast--warning .tcf-ws-toast__icon { background: #FFFBEB; color: #B45309; }
.tcf-ws-toast--error .tcf-ws-toast__icon { background: #FEF2F2; color: #B91C1C; }
.tcf-ws-toast--info .tcf-ws-toast__icon { background: #EEF4FF; color: #1363DF; }

.tcf-ws-toast__text strong {
    font-weight: 600;
    color: #0F172A;
}

/* Bouton d'action sous le texte (ex. « Effacer mes textes » après une restauration) */
.tcf-ws-toast__action {
    display: block;
    margin: 8px 0 0;
    padding: 6px 12px;
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: #B91C1C;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.tcf-ws-toast__action:hover,
.tcf-ws-toast__action:focus-visible {
    background: #FEF2F2;
    border-color: #FECACA;
}

/* Notifications du système de crédits */
body.tcf-ws-page .tcf-notification {
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
    font-family: var(--ws-font);
    color: var(--ws-slate);
}

body.tcf-ws-page .tcf-notification-success .tcf-notification-content i,
body.tcf-ws-page .tcf-notification-success .tcf-notification-content svg {
    color: var(--ws-green);
}

body.tcf-ws-page .tcf-notification-error .tcf-notification-content i,
body.tcf-ws-page .tcf-notification-error .tcf-notification-content svg {
    color: var(--ws-red);
}

/* ═════════════════════════════ Correction en cours ═════════════════════════════ */

/* Fond bleu tramé plein écran (comme l'écran « Analyse en cours » des quiz et l'en-tête des résultats),
   carte blanche au centre */
body.tcf-ws-page #correction-loader {
    background: var(--ws-blue);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

body.tcf-ws-page #correction-loader .loader-overlay {
    position: relative;
    isolation: isolate;
    padding: 24px 16px;
    background:
        radial-gradient(ellipse 60% 50% at 50% 45%, rgba(255, 255, 255, 0.12), transparent 70%),
        var(--ws-blue);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

body.tcf-ws-page #correction-loader .loader-overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
    background-size: 44px 44px;
    -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 20%, transparent 75%);
    mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 20%, transparent 75%);
    pointer-events: none;
}

body.tcf-ws-page #correction-loader .loader-glass-card {
    width: 100%;
    max-width: 440px;
    padding: 32px 28px 24px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 16px;
    box-shadow: 0 24px 60px rgba(8, 42, 94, 0.35);
    font-family: var(--ws-font);
    text-align: center;
    animation: wsLoaderCardIn 0.25s ease both;
}

@keyframes wsLoaderCardIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}

body.tcf-ws-page #correction-loader .loader-header {
    margin: 0 0 22px;
}

/* Anneau qui tourne autour d'une pastille fixe (icône) */
body.tcf-ws-page #correction-loader .loader-animation {
    position: relative;
    width: 64px;
    height: 64px;
    margin: 0 auto 18px;
}

body.tcf-ws-page #correction-loader .tcf-spinner {
    position: absolute;
    inset: 0;
    width: auto;
    height: auto;
    margin: 0;
    border: 3px solid #E5EDFB;
    border-top-color: var(--ws-blue);
    border-radius: 50%;
    animation: wsLoaderSpin 0.9s linear infinite;
}

@keyframes wsLoaderSpin {
    to { transform: rotate(360deg); }
}

body.tcf-ws-page #correction-loader .ws-loader-icon {
    position: absolute;
    inset: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ws-blue-soft);
    border-radius: 50%;
    color: var(--ws-blue);
}

body.tcf-ws-page #correction-loader .ws-loader-icon svg {
    width: 20px;
    height: 20px;
}

body.tcf-ws-page #correction-loader .loader-title {
    margin: 0 0 6px;
    font-family: var(--ws-font);
    font-size: 19px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.01em;
    text-transform: none;
    color: var(--ws-ink);
}

body.tcf-ws-page #correction-loader .ws-loader-desc {
    max-width: 340px;
    margin: 0 auto;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ws-muted);
}

body.tcf-ws-page #correction-loader .loader-progress-container {
    height: 6px;
    margin: 0;
    background: var(--ws-page);
    border-radius: 999px;
    overflow: hidden;
}

body.tcf-ws-page #correction-loader .loader-progress-bar {
    background: var(--ws-blue);
    border-radius: 999px;
}

body.tcf-ws-page #correction-loader .loader-steps {
    margin: 10px 0 0;
}

body.tcf-ws-page #correction-loader .loader-current-step {
    min-height: 20px;
    margin: 0;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5;
    color: var(--ws-slate);
}

/* Astuce : encart bleu pâle, pastille blanche */
body.tcf-ws-page #correction-loader .loader-tips-container {
    margin: 22px 0 0;
    text-align: left;
}

body.tcf-ws-page #correction-loader .loader-tip-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    background: var(--ws-blue-soft);
    border: 1px solid var(--ws-blue-line);
    border-radius: 12px;
    box-shadow: none;
}

body.tcf-ws-page #correction-loader .tip-icon {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    padding: 0;
    background: #fff;
    border: 1px solid var(--ws-blue-line);
    border-radius: 10px;
    color: var(--ws-blue);
}

body.tcf-ws-page #correction-loader .tip-icon svg {
    width: 17px;
    height: 17px;
}

body.tcf-ws-page #correction-loader .tip-label {
    margin: 1px 0 3px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ws-blue-dark);
}

body.tcf-ws-page #correction-loader .tip-text {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--ws-slate);
}

/* Avertissement : pastille ambre avec point qui pulse */
body.tcf-ws-page #correction-loader .loader-footer {
    margin: 20px 0 0;
}

body.tcf-ws-page #correction-loader .ws-loader-warning {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 7px 14px;
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--ws-amber-ink);
    text-align: left;
}

body.tcf-ws-page #correction-loader .ws-loader-pulse {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    background: var(--ws-amber);
    border-radius: 50%;
    animation: wsLoaderPulse 2s ease-in-out infinite;
}

@keyframes wsLoaderPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.45); }
    50% { box-shadow: 0 0 0 5px rgba(245, 158, 11, 0); }
}

@media (max-width: 480px) {
    body.tcf-ws-page #correction-loader .loader-glass-card {
        padding: 26px 18px 20px;
    }

    body.tcf-ws-page #correction-loader .loader-title {
        font-size: 17px;
    }
}

/* ═════════════════════════════ Responsive ═════════════════════════════ */

@media (max-width: 1200px) {
    body.tcf-ws-page .main-layout {
        grid-template-columns: 230px minmax(0, 1fr) 260px;
        gap: 16px;
    }

    body.tcf-ws-page .main-layout > .main-content {
        padding: 22px 22px 20px;
    }
}

@media (max-width: 1024px) {
    body.tcf-ws-page .main-layout > .sidebar.left-sidebar,
    body.tcf-ws-page .main-layout > .sidebar.right-sidebar {
        position: static;
    }
}

@media (max-width: 768px) {
    body.tcf-ws-page .simulator__container {
        padding: 12px;
    }

    body.tcf-ws-page .main-layout > .sidebar.left-sidebar {
        margin-bottom: 12px;
    }

    body.tcf-ws-page .task-list {
        flex-direction: row;
        gap: 6px;
    }

    body.tcf-ws-page .task-list .task-item {
        flex: 1 1 0;
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        justify-items: center;
        row-gap: 4px;
        padding: 8px 6px;
        text-align: center;
    }

    body.tcf-ws-page .task-list .task-item::before {
        grid-row: auto;
        width: 26px;
        height: 26px;
        font-size: 12px;
    }

    body.tcf-ws-page .task-list .task-item::after {
        display: none;
    }

    /* !important : le script affiche la pastille avec un style en ligne */
    body.tcf-ws-page .task-list .task-item .ws-task-words {
        display: none !important;
    }

    body.tcf-ws-page .sidebar-note {
        display: none;
    }

    body.tcf-ws-page .main-layout > .main-content {
        padding: 18px 16px;
    }

    body.tcf-ws-page .content-header h2 {
        font-size: 18px;
    }

    body.tcf-ws-page .text-input,
    body.tcf-ws-page .text-input.main-textarea {
        min-height: 420px;
        padding: 14px 16px;
    }

    body.tcf-ws-page .response-area .timer {
        justify-content: flex-start;
        margin-bottom: 12px;
        border: 1px solid var(--ws-blue-line);
    }

    body.tcf-ws-page .character-grid-mobile {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 6px;
        margin-bottom: 12px;
    }

    /* Au doigt : on garde une hauteur confortable */
    body.tcf-ws-page .character-grid-mobile .char-button {
        height: 38px;
        font-size: 15px;
    }

    /* Compteur de mots sur sa ligne, puis Précédent / Suivant côte à côte sur toute la largeur
       (avant : boutons collés à gauche, de largeurs différentes) */
    body.tcf-ws-page .navigation {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        justify-content: flex-start;
    }

    body.tcf-ws-page .navigation .word-counter {
        align-self: flex-start;
    }

    body.tcf-ws-page .nav-buttons {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        width: 100%;
    }

    body.tcf-ws-page .nav-buttons .btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin: 0;
    }

    body.tcf-ws-page .mobile-download-section {
        display: flex;
        margin-top: 18px !important;
    }

    body.tcf-ws-page .tcf-popup-overlay .tcf-popup-actions,
    body.tcf-ws-page .correction-popup-overlay .correction-popup-actions,
    body.tcf-ws-page .fm-exit-overlay .fm-exit-buttons,
    body.tcf-ws-page .tcf-pdf-limit-modal__actions {
        flex-direction: column-reverse;
    }

    body.tcf-ws-page .tcf-popup-overlay .tcf-popup-btn,
    body.tcf-ws-page .correction-popup-overlay .popup-btn {
        width: 100%;
    }

    .tcf-ws-toasts {
        top: calc(var(--wp-admin--admin-bar--height, 0px) + 12px);
        right: 16px;
    }
}

/* ═════════════════════════════ Résultats de la correction ═════════════════════════════
   Même langage que la page « Mes travaux » : en-tête bleu tramé (note finale et échelle
   A1 → C2), carte blanche qui remonte sur le bas de l'en-tête, une tâche à la fois.
   Contenu généré par correction-interface.js (classes ws-rp-*). Les anciennes feuilles
   posent des règles en !important sur #results__container : celles qu'il faut contrer
   le sont ici, avec la raison en commentaire. */

/* !important : simulator__style.css et correction-interface(-final).css imposent fond blanc,
   bordure, ombre et padding en !important */
body.tcf-ws-page #results__container {
    max-width: 1100px;
    min-height: 0;
    margin: 0 auto;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none !important;
    font-family: var(--ws-font);
    color: var(--ws-ink);
}

/* Le thème impose sa police aux titres, paragraphes, listes et boutons */
body.tcf-ws-page #results__container :is(h1, h2, h4, p, li, button, a) {
    font-family: inherit;
}

body.tcf-ws-page #results__container .wrapper__container {
    max-width: none;
    margin: 0;
    padding: 0;
    background: none;
}

/* ── En-tête ─────────────────────────────────────────────── */

/* Vue des résultats (classe posée par showCorrectionInterface) : la bande bleue part du menu du site,
   comme les autres en-têtes (Mes travaux, Expression écrite). !important : correction-interface.css
   impose « margin: 25px auto !important » à .main__wrapper */
body.tcf-ws-page.ws-results-view .main__wrapper {
    margin-top: 0 !important;
}

body.tcf-ws-page.ws-results-view .simulator__container {
    padding-top: 0;
}

/* La bande déborde jusqu'aux bords de l'écran : on coupe le débordement horizontal (100vw inclut
   la barre de défilement). clip, contrairement à hidden, ne casse pas les éléments collants */
body.tcf-ws-page.ws-results-view {
    overflow-x: clip;
}

body.tcf-ws-page #results__container .ws-rp-hero {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    gap: 22px;
    margin: 0;
    padding: 22px 18px 86px;
    background: transparent;
    color: #fff;
}

/* Fond bleu et trame en pleine largeur ; le contenu reste dans la colonne des résultats */
body.tcf-ws-page #results__container .ws-rp-hero::before,
body.tcf-ws-page #results__container .ws-rp-hero::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    z-index: -1;
    pointer-events: none;
}

body.tcf-ws-page #results__container .ws-rp-hero::before {
    background: var(--ws-blue);
}

/* Trame fine, plus visible vers la droite */
body.tcf-ws-page #results__container .ws-rp-hero::after {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
    background-size: 44px 44px;
    -webkit-mask-image: linear-gradient(90deg, transparent 15%, #000 75%);
    mask-image: linear-gradient(90deg, transparent 15%, #000 75%);
    pointer-events: none;
}

body.tcf-ws-page #results__container .ws-rp-hero-text {
    min-width: 0;
}

body.tcf-ws-page #results__container .ws-rp-back {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    width: auto;
    margin: 0 0 18px;
    padding: 6px 12px 6px 10px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 8px;
    box-shadow: none;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    text-transform: none;
    color: #fff;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

body.tcf-ws-page #results__container .ws-rp-back:hover {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.5);
    color: #fff;
}

body.tcf-ws-page #results__container .ws-rp-back:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

body.tcf-ws-page #results__container .ws-rp-eyebrow {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.72);
}

body.tcf-ws-page #results__container .ws-rp-title {
    margin: 0;
    font-size: 23px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.02em;
    text-transform: none;
    color: #fff;
}

body.tcf-ws-page #results__container .ws-rp-lead {
    margin: 8px 0 0;
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.82);
}

/* Note + échelle A1 → C2 (le niveau atteint est marqué sur le filet) */
body.tcf-ws-page #results__container .ws-rp-score {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    flex-shrink: 0;
}

body.tcf-ws-page #results__container .ws-rp-score-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.72);
}

body.tcf-ws-page #results__container .ws-rp-score-value {
    font-size: 42px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.02em;
    color: #fff;
    font-variant-numeric: tabular-nums;
}

/* !important : correction-interface-final.css colore .main-score en !important (dégradé, ombre) */
body.tcf-ws-page #results__container .ws-rp-score-value .main-score {
    display: inline;
    margin: 0;
    font: inherit;
    color: inherit !important;
    -webkit-text-fill-color: currentColor;
    background: none;
    text-shadow: none;
    filter: none;
    animation: none;
}

body.tcf-ws-page #results__container .ws-rp-score-value small {
    margin-left: 2px;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0;
    color: rgba(255, 255, 255, 0.7);
}

body.tcf-ws-page #results__container .ws-rp-score.is-pending .ws-rp-score-value {
    font-size: 30px;
}

body.tcf-ws-page #results__container .ws-rp-scale {
    display: flex;
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.35);
}

body.tcf-ws-page #results__container .ws-rp-scale span {
    position: relative;
    width: 36px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-align: center;
    color: rgba(255, 255, 255, 0.45);
}

body.tcf-ws-page #results__container .ws-rp-scale span::before {
    content: "";
    position: absolute;
    top: -13px;
    left: 50%;
    width: 1px;
    height: 6px;
    background: rgba(255, 255, 255, 0.45);
}

body.tcf-ws-page #results__container .ws-rp-scale span.is-reached {
    color: rgba(255, 255, 255, 0.8);
}

body.tcf-ws-page #results__container .ws-rp-scale span.is-current {
    font-weight: 600;
    color: #fff;
}

body.tcf-ws-page #results__container .ws-rp-scale span.is-current::before {
    top: -15px;
    width: 9px;
    height: 9px;
    margin-left: -4px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25);
}

/* ── Carte des tâches : remonte sur le bas de l'en-tête ─────── */
body.tcf-ws-page #results__container .ws-rp-stage {
    position: relative;
    margin: -64px 10px 0;
    padding: 0;
}

body.tcf-ws-page #results__container .ws-rp-card {
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);
}

body.tcf-ws-page #results__container .ws-rp-card-head {
    padding: 16px;
    background: var(--ws-soft);
    border-bottom: 1px solid var(--ws-line);
}

body.tcf-ws-page #results__container .ws-rp-card-title {
    display: block;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -0.01em;
    text-transform: none;
    color: var(--ws-ink);
}

body.tcf-ws-page #results__container .ws-rp-card-lead {
    margin: 4px 0 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ws-muted);
}

/* Onglets des tâches (haut et bas de la carte) */
body.tcf-ws-page #results__container .ws-rp-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 14px 0 0;
    padding: 0;
    background: none;
    border: 0;
}

body.tcf-ws-page #results__container .ws-rp-tab {
    -webkit-appearance: none;
    appearance: none;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    width: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 10px;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 12px;
    box-shadow: none;
    line-height: 1.3;
    text-align: left;
    text-transform: none;
    color: var(--ws-ink);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

body.tcf-ws-page #results__container .ws-rp-tab:hover {
    background: #FAFCFF;
    border-color: #B6CFF5;
    color: var(--ws-ink);
}

body.tcf-ws-page #results__container .ws-rp-tab:focus-visible {
    outline: 2px solid var(--ws-blue);
    outline-offset: 2px;
}

/* Tâche affichée : bordure bleue (anneau intérieur, sans décalage) */
body.tcf-ws-page #results__container .ws-rp-tab.is-active {
    background: #F5F8FF;
    border-color: var(--ws-blue);
    box-shadow: inset 0 0 0 1px var(--ws-blue);
}

body.tcf-ws-page #results__container .ws-rp-tab-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    width: 100%;
    margin-bottom: 6px;
}

body.tcf-ws-page #results__container .ws-rp-task-num {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: var(--ws-blue-soft);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ws-blue);
    transition: background 0.15s ease, color 0.15s ease;
}

body.tcf-ws-page #results__container .ws-rp-tab.is-active .ws-rp-task-num {
    background: var(--ws-blue);
    color: #fff;
}

body.tcf-ws-page #results__container .ws-rp-tab-kicker {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ws-muted);
}

body.tcf-ws-page #results__container .ws-rp-tab.is-active .ws-rp-tab-kicker {
    color: var(--ws-blue);
}

/* Petit écran : numéro, note et « Tâche n » suffisent */
body.tcf-ws-page #results__container .ws-rp-tab-name,
body.tcf-ws-page #results__container .ws-rp-long {
    display: none;
}

body.tcf-ws-page #results__container .ws-rp-tab-name {
    max-width: 100%;
    overflow: hidden;
    font-size: 14px;
    font-weight: 600;
    color: var(--ws-ink);
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.tcf-ws-page #results__container .ws-rp-chip {
    display: inline-flex;
    align-items: baseline;
    padding: 3px 7px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page #results__container .ws-rp-chip small {
    margin-left: 1px;
    font-size: 11px;
    font-weight: 500;
    opacity: 0.75;
}

body.tcf-ws-page #results__container .ws-rp-chip.is-good {
    background: #F0FDF4;
    color: #15803D;
}

body.tcf-ws-page #results__container .ws-rp-chip.is-medium {
    background: var(--ws-amber-soft);
    color: var(--ws-amber-ink);
}

body.tcf-ws-page #results__container .ws-rp-chip.is-low {
    background: var(--ws-red-soft);
    color: #DC2626;
}

body.tcf-ws-page #results__container .ws-rp-status {
    padding: 3px 7px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

body.tcf-ws-page #results__container .ws-rp-status.is-pending {
    background: var(--ws-amber-soft);
    color: var(--ws-amber-ink);
}

body.tcf-ws-page #results__container .ws-rp-status.is-failed {
    background: var(--ws-red-soft);
    color: #DC2626;
}

/* Barre du bas : changer de tâche sans remonter */
body.tcf-ws-page #results__container .ws-rp-tabs-foot {
    padding: 16px;
    background: var(--ws-soft);
    border-top: 1px solid var(--ws-line);
}

body.tcf-ws-page #results__container .ws-rp-tabs-foot[hidden],
body.tcf-ws-page #results__container .ws-rp-panel[hidden] {
    display: none;
}

body.tcf-ws-page #results__container .ws-rp-tabs-label {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ws-muted);
}

body.tcf-ws-page #results__container .ws-rp-tabs-foot .ws-rp-tabs {
    margin-top: 10px;
}

/* ── Panneau d'une tâche ─────────────────────────────────── */
body.tcf-ws-page #results__container .ws-rp-panel {
    padding: 20px 16px 22px;
}

body.tcf-ws-page #results__container .ws-rp-panel > * {
    margin: 0;
}

body.tcf-ws-page #results__container .ws-rp-panel > * + * {
    margin-top: 16px;
}

/* Repères : note, niveau, nombre de mots */
body.tcf-ws-page #results__container .ws-rp-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body.tcf-ws-page #results__container .ws-rp-fact {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 6px 12px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 8px;
    font-size: 13px;
    color: var(--ws-muted);
}

body.tcf-ws-page #results__container .ws-rp-fact strong {
    font-size: 14px;
    font-weight: 600;
    color: var(--ws-ink);
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page #results__container .ws-rp-fact em {
    font-style: normal;
    color: var(--ws-faint);
}

/* Couleur selon le cas (mêmes tons que les notes des onglets) :
   note et niveau jusqu'à B1 rouge, B2 orange, C1-C2 vert ; mots vert dans la fourchette, rouge en dehors */
body.tcf-ws-page #results__container .ws-rp-fact.is-good {
    background: #F0FDF4;
    border-color: var(--ws-green-line);
}

body.tcf-ws-page #results__container .ws-rp-fact.is-good strong {
    color: #15803D;
}

body.tcf-ws-page #results__container .ws-rp-fact.is-medium {
    background: var(--ws-amber-soft);
    border-color: var(--ws-amber-line);
}

body.tcf-ws-page #results__container .ws-rp-fact.is-medium strong {
    color: var(--ws-amber-ink);
}

body.tcf-ws-page #results__container .ws-rp-fact.is-low {
    background: var(--ws-red-soft);
    border-color: var(--ws-red-line);
}

body.tcf-ws-page #results__container .ws-rp-fact.is-low strong {
    color: #DC2626;
}

/* Sujet : carte bleue claire, documents de la tâche 3 en encarts */
body.tcf-ws-page #results__container .ws-rp-subject {
    padding: 16px;
    background: var(--ws-blue-soft);
    border: 1px solid var(--ws-blue-line);
    border-radius: 12px;
}

body.tcf-ws-page #results__container .ws-rp-subject-title {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ws-blue);
}

body.tcf-ws-page #results__container .ws-rp-subject-title svg {
    flex-shrink: 0;
}

body.tcf-ws-page #results__container .ws-rp-subject-text {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--ws-ink);
}

body.tcf-ws-page #results__container .ws-rp-subject-dossier {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--ws-navy);
}

body.tcf-ws-page #results__container .ws-rp-subject-text + .ws-rp-subject-dossier {
    margin-top: 10px;
}

body.tcf-ws-page #results__container .ws-rp-doc {
    margin: 12px 0 0;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.75);
    border: 1px solid #C8DAF7;
    border-radius: 10px;
}

body.tcf-ws-page #results__container .ws-rp-doc-title {
    margin: 0 0 4px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ws-blue);
}

body.tcf-ws-page #results__container .ws-rp-doc-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.65;
    color: var(--ws-ink);
}

/* Réponse du candidat */
body.tcf-ws-page #results__container .ws-rp-response {
    padding: 16px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 12px;
}

body.tcf-ws-page #results__container .ws-rp-block-label {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ws-slate);
}

body.tcf-ws-page #results__container .ws-rp-block-label span {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    color: var(--ws-faint);
}

body.tcf-ws-page #results__container .ws-rp-response-text {
    font-size: 15px;
    line-height: 1.8;
    color: var(--ws-ink);
    overflow-wrap: anywhere;
}

/* Tâche sans réponse ou non corrigée */
body.tcf-ws-page #results__container .ws-rp-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    background: var(--ws-amber-soft);
    border: 1px solid var(--ws-amber-line);
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.55;
    color: #92400E;
}

body.tcf-ws-page #results__container .ws-rp-notice svg {
    flex-shrink: 0;
    margin-top: 2px;
}

body.tcf-ws-page #results__container .ws-rp-notice.is-error {
    background: var(--ws-red-soft);
    border-color: var(--ws-red-line);
    color: #991B1B;
}

/* Titres de section : libellé bleu suivi d'un filet */
body.tcf-ws-page #results__container .ws-rp-panel > .ws-rp-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 28px 0 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ws-blue);
}

body.tcf-ws-page #results__container .ws-rp-section-title::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--ws-line);
}

body.tcf-ws-page #results__container .ws-rp-panel > .ws-rp-section-title + * {
    margin-top: 0;
}

body.tcf-ws-page #results__container .ws-rp-count {
    padding: 1px 7px;
    background: var(--ws-blue-soft);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--ws-blue);
    font-variant-numeric: tabular-nums;
}

body.tcf-ws-page #results__container .ws-rp-count.is-soft {
    background: #F1F5F9;
    font-weight: 500;
    text-transform: none;
    color: var(--ws-muted);
}

/* Critères : une liste encadrée, un critère par bloc */
body.tcf-ws-page #results__container .ws-rp-criteria {
    overflow: hidden;
    border: 1px solid var(--ws-line);
    border-radius: 12px;
}

body.tcf-ws-page #results__container .ws-rp-criterion {
    padding: 14px 16px;
    border-top: 1px solid var(--ws-line);
}

body.tcf-ws-page #results__container .ws-rp-criterion:first-child {
    border-top: 0;
}

body.tcf-ws-page #results__container .ws-rp-criterion-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 6px 12px;
    margin: 0 0 10px;
}

body.tcf-ws-page #results__container .ws-rp-criterion-title {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--ws-ink);
}

body.tcf-ws-page #results__container .ws-rp-tag {
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}

body.tcf-ws-page #results__container .ws-rp-tag.is-ok {
    background: #F0FDF4;
    color: #15803D;
}

body.tcf-ws-page #results__container .ws-rp-tag.is-review {
    background: var(--ws-amber-soft);
    color: var(--ws-amber-ink);
}

body.tcf-ws-page #results__container .ws-rp-points,
body.tcf-ws-page #results__container .ws-rp-list,
body.tcf-ws-page #results__container .ws-rp-errors {
    margin: 0;
    padding: 0;
    list-style: none;
}

body.tcf-ws-page #results__container .ws-rp-points li,
body.tcf-ws-page #results__container .ws-rp-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 8px;
    padding: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ws-slate);
    list-style: none;
}

body.tcf-ws-page #results__container .ws-rp-points li:last-child,
body.tcf-ws-page #results__container .ws-rp-list li:last-child {
    margin-bottom: 0;
}

body.tcf-ws-page #results__container .ws-rp-points li::before,
body.tcf-ws-page #results__container .ws-rp-list li::before {
    display: none;
}

body.tcf-ws-page #results__container .ws-rp-point-icon {
    flex-shrink: 0;
    display: inline-flex;
    margin-top: 3px;
    color: var(--ws-faint);
}

/* Points d'un critère : une ligne teintée par point, pastille ronde pleine et texte en ton profond
   (vert = acquis, rouge = à revoir) */
body.tcf-ws-page #results__container .ws-rp-points {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.tcf-ws-page #results__container .ws-rp-points li {
    margin: 0;
    padding: 9px 12px;
    border: 1px solid var(--ws-line);
    border-radius: 10px;
}

body.tcf-ws-page #results__container .ws-rp-points li.is-positive {
    background: #F0FDF4;
    border-color: #DCFCE7;
}

body.tcf-ws-page #results__container .ws-rp-points li.is-negative {
    background: #FEF2F2;
    border-color: #FEE2E2;
}

body.tcf-ws-page #results__container .ws-rp-points .ws-rp-point-icon {
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-top: 1px;
    border-radius: 50%;
}

body.tcf-ws-page #results__container .ws-rp-points li.is-positive .ws-rp-point-icon {
    background: #16A34A;
    color: #fff;
}

body.tcf-ws-page #results__container .ws-rp-points li.is-negative .ws-rp-point-icon {
    background: #DC2626;
    color: #fff;
}

body.tcf-ws-page #results__container .ws-rp-points li.is-positive .ws-rp-point-text {
    color: #14532D;
}

body.tcf-ws-page #results__container .ws-rp-points li.is-negative .ws-rp-point-text {
    color: #7F1D1D;
}

/* « Revoir la règle sur Google : <question> » : recherche Google, sous le point ou en bas de l'erreur */
body.tcf-ws-page #results__container .ws-rp-search-link {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    margin: 8px 0 0;
    padding: 4px 10px;
    background: #fff;
    border: 1px solid var(--ws-blue-line);
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--ws-blue);
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease;
}

body.tcf-ws-page #results__container .ws-rp-search-link:hover {
    background: var(--ws-blue-soft);
    border-color: var(--ws-blue);
    color: var(--ws-blue-dark);
    text-decoration: none;
}

body.tcf-ws-page #results__container .ws-rp-search-link svg {
    flex-shrink: 0;
    margin-top: 4px;
}

body.tcf-ws-page #results__container .ws-rp-search-link svg:last-child {
    opacity: 0.7;
}

/* La notion à revoir, en texte neutre ; le libellé reste bleu */
body.tcf-ws-page #results__container .ws-rp-search-text {
    min-width: 0;
    font-weight: 500;
    color: var(--ws-slate);
}

body.tcf-ws-page #results__container .ws-rp-search-text strong {
    font-weight: 600;
    color: var(--ws-blue);
}

/* Erreurs relevées : type, erreur, correction proposée, explication */
body.tcf-ws-page #results__container .ws-rp-errors {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Bordure rouge sur tout le tour : on repère d'un coup d'œil qu'il s'agit d'une faute */
body.tcf-ws-page #results__container .ws-rp-error {
    margin: 0;
    padding: 12px 16px;
    background: #fff;
    border: 1px solid #FCA5A5;
    border-radius: 10px;
    list-style: none;
}

body.tcf-ws-page #results__container .ws-rp-error::before {
    display: none;
}

body.tcf-ws-page #results__container .ws-rp-error-type {
    display: block;
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ws-faint);
}

body.tcf-ws-page #results__container .ws-rp-error-wrong {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--ws-red-ink);
}

body.tcf-ws-page #results__container .ws-rp-error-fix {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 6px 0 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    color: #15803D;
}

body.tcf-ws-page #results__container .ws-rp-error-fix svg {
    flex-shrink: 0;
    margin-top: 3px;
}

body.tcf-ws-page #results__container .ws-rp-error-why {
    margin: 8px 0 0;
    padding-top: 8px;
    border-top: 1px dashed #FECACA;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ws-muted);
}

/* Méthodologie : panneau teinté */
body.tcf-ws-page #results__container .ws-rp-list {
    padding: 16px 18px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 12px;
}

/* Points forts, conseils : une carte par élément, comme les points des critères
   (pastille ronde pleine ; vert = point fort, ambre = conseil) */
body.tcf-ws-page #results__container .ws-rp-list.is-strengths,
body.tcf-ws-page #results__container .ws-rp-list.is-advice {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
}

body.tcf-ws-page #results__container .ws-rp-list.is-strengths li,
body.tcf-ws-page #results__container .ws-rp-list.is-advice li {
    margin: 0;
    padding: 9px 12px;
    border: 1px solid;
    border-radius: 10px;
}

body.tcf-ws-page #results__container .ws-rp-list.is-strengths li {
    background: #F0FDF4;
    border-color: #DCFCE7;
    color: #14532D;
}

body.tcf-ws-page #results__container .ws-rp-list.is-advice li {
    background: #FFFBEB;
    border-color: #FEF3C7;
    color: #78350F;
}

body.tcf-ws-page #results__container .ws-rp-list.is-strengths .ws-rp-point-icon,
body.tcf-ws-page #results__container .ws-rp-list.is-advice .ws-rp-point-icon {
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-top: 1px;
    border-radius: 50%;
    color: #fff;
}

body.tcf-ws-page #results__container .ws-rp-list.is-strengths .ws-rp-point-icon {
    background: #16A34A;
}

body.tcf-ws-page #results__container .ws-rp-list.is-advice .ws-rp-point-icon {
    background: #D97706;
}

/* Proposition de correction : copie propre */
body.tcf-ws-page #results__container .ws-rp-corrected {
    padding: 18px 20px;
    background: var(--ws-soft);
    border: 1px solid var(--ws-line);
    border-radius: 12px;
    font-size: 15px;
    line-height: 1.8;
    color: var(--ws-ink);
    overflow-wrap: anywhere;
}

/* ── Tablette et plus ─────────────────────────────────────── */
@media (min-width: 640px) {
    body.tcf-ws-page #results__container .ws-rp-hero {
        padding: 26px 26px 92px;
    }

    body.tcf-ws-page #results__container .ws-rp-title {
        font-size: 26px;
    }

    body.tcf-ws-page #results__container .ws-rp-stage {
        margin: -68px 18px 0;
    }

    body.tcf-ws-page #results__container .ws-rp-card-head,
    body.tcf-ws-page #results__container .ws-rp-tabs-foot {
        padding: 18px 22px;
    }

    body.tcf-ws-page #results__container .ws-rp-panel {
        padding: 24px 22px 26px;
    }

    body.tcf-ws-page #results__container .ws-rp-tab {
        padding: 12px 14px;
    }

    body.tcf-ws-page #results__container .ws-rp-long {
        display: inline;
    }

    body.tcf-ws-page #results__container .ws-rp-short {
        display: none;
    }

    body.tcf-ws-page #results__container .ws-rp-tab-name {
        display: block;
    }

    body.tcf-ws-page #results__container .ws-rp-tab-top {
        margin-bottom: 8px;
    }

    body.tcf-ws-page #results__container .ws-rp-task-num {
        width: 32px;
        height: 32px;
    }

    body.tcf-ws-page #results__container .ws-rp-chip {
        padding: 3px 8px;
        font-size: 14px;
    }

    body.tcf-ws-page #results__container .ws-rp-response,
    body.tcf-ws-page #results__container .ws-rp-subject {
        padding: 18px 22px;
    }

    body.tcf-ws-page #results__container .ws-rp-criterion {
        padding: 16px 20px;
    }

    body.tcf-ws-page #results__container .ws-rp-corrected {
        padding: 20px 24px;
    }
}

/* Écran large : texte à gauche, note alignée en bas à droite */
@media (min-width: 900px) {
    body.tcf-ws-page #results__container .ws-rp-hero {
        flex-direction: row;
        align-items: flex-end;
        justify-content: space-between;
        gap: 32px;
        padding: 30px 34px 100px;
    }

    body.tcf-ws-page #results__container .ws-rp-score {
        align-items: flex-end;
        margin-bottom: 2px;
    }

    body.tcf-ws-page #results__container .ws-rp-score-value {
        font-size: 46px;
    }

    body.tcf-ws-page #results__container .ws-rp-title {
        font-size: 28px;
    }

    body.tcf-ws-page #results__container .ws-rp-stage {
        margin: -72px 28px 0;
    }
}

body.tcf-ws-page .btn-download.is-loading {
    opacity: 0.7;
    cursor: progress;
}

/* Audit UX du 2026-10-10 (X7/E1) : « Recharger mes essais » mène aux offres, WhatsApp en second */
body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-side-card__alt {
    display: block;
    margin-top: 8px;
    font-family: var(--ws-font);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
    color: var(--ws-slate);
    text-decoration: none;
}

body.tcf-ws-page .sidebar.left-sidebar .ws-side-card .ws-side-card__alt:hover {
    color: #0B8A4D;
    text-decoration: underline;
    text-underline-offset: 3px;
}