/*
 * Gamification — feuille SÉPARÉE, volontairement.
 * Les styles existants ne sont pas touchés. Pour s'en passer :
 *   add_action( 'wp_enqueue_scripts', function () {
 *       wp_dequeue_style( 'tph-jn-game' );
 *   }, 20 );
 */

.tph-app .run { color: var(--brass); font-weight: 600; }
.tph-app .run.hot { color: var(--tph-retry); }

.tph-app .streak:empty { display: none; }
.tph-app .streak {
    font-size: .85rem; margin: 0 0 1rem;
    padding: .55rem .8rem; border-radius: 6px;
    background: var(--paper); border: 1px solid var(--line);
    border-left: 3px solid var(--brass);
    text-align: left;
}

.tph-app .badges { text-align: left; margin-top: 1.25rem; }
.tph-app .badges h2 {
    font-size: .72rem; text-transform: uppercase; letter-spacing: .08em;
    color: var(--mute); margin: 1rem 0 .5rem;
}
.tph-app .badge-list { list-style: none; margin: 0; padding: 0; }

/* Acquis anciens : compacts, en pastilles — on les survole sans s'y arrêter */
.tph-app .badge-list:not(.new):not(.todo) { display: flex; flex-wrap: wrap; gap: .4rem; }
.tph-app .badge-list:not(.new):not(.todo) li {
    font-size: .78rem; padding: .25rem .6rem; border-radius: 999px;
    background: var(--paper); border: 1px solid var(--line); color: var(--mute);
}

/* Nouveaux et à venir : détaillés, pour qu'on sache ce qu'ils veulent dire */
.tph-app .badge-list.new li,
.tph-app .badge-list.todo li {
    padding: .55rem .75rem; border-radius: 6px; margin-bottom: .4rem;
    border: 1px solid var(--line); background: var(--card);
}
.tph-app .badge-list.new li {
    border-color: var(--brass); background: #fdf8f0;
}
.tph-app .badge-list.todo li { opacity: .62; }
.tph-app .badge-list.new strong,
.tph-app .badge-list.todo strong { display: block; font-size: .92rem; }
.tph-app .badge-list.new span,
.tph-app .badge-list.todo span { font-size: .8rem; color: var(--mute); }

/* Interface professeur */
.tph-admin .tph-badges { display: flex; flex-wrap: wrap; gap: .35rem; margin: .4rem 0 1rem; }
.tph-admin .tph-badges li {
    list-style: none; font-size: .78rem; padding: .22rem .55rem;
    border-radius: 999px; background: #fff; border: 1px solid #dfdbd2;
}