/* ============================================================
   motex-daily.css — Mode mot du jour
   v1 — complement de motex.css (grille + clavier reutilises)
   Famille MOTS (rouge). Bandeau serie (flamme orange) + paliers hebdo.
   ============================================================ */

.mtx-daily { padding-top: var(--space-6); }

/* Barre haute : retour */
.mtx-daily-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-5);
}
.mtx-daily-back {
  font-family: var(--font-title);
  font-size: .85rem;
  letter-spacing: 2px;
  color: var(--muted-2);
  transition: var(--transition);
}
.mtx-daily-back:hover { color: var(--red); }

/* ===== Banniere serie ===== */
.mtx-streak {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  background: var(--surface);
  border: 1px solid rgba(255, 140, 66, .22);
  border-radius: var(--radius-lg);
  padding: var(--space-3) var(--space-4);
  margin-bottom: var(--space-3);
}
.mtx-streak[hidden] { display: none; }
.mtx-streak-flame { font-size: 1.8rem; line-height: 1; }
.mtx-streak-main { flex: 1; }
.mtx-streak-line {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 1.3rem;
  line-height: 1;
  color: var(--text);
}
.mtx-streak-best {
  font-size: .72rem;
  color: var(--muted);
  margin-top: var(--space-1);
}
.mtx-streak-badge {
  font-size: .68rem;
  color: var(--green);
  background: rgba(60, 255, 180, .1);
  border: 1px solid rgba(60, 255, 180, .3);
  border-radius: var(--radius-pill);
  padding: var(--space-1) var(--space-3);
  letter-spacing: 1px;
  white-space: nowrap;
}
.mtx-streak-badge[hidden] { display: none; }

/* ===== Paliers hebdo ===== */
.mtx-pal-intro {
  font-size: .72rem;
  color: var(--gold);
  margin-bottom: var(--space-2);
}
.mtx-pal-intro[hidden] { display: none; }

.mtx-paliers {
  display: flex;
  gap: var(--space-2);
  margin-bottom: var(--space-6);
}
.mtx-paliers[hidden] { display: none; }

.mtx-pal {
  flex: 1;
  text-align: center;
  padding: var(--space-2) var(--space-1);
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
  background: var(--surface);
}
.mtx-pal-week { font-size: .8rem; font-weight: 800; color: var(--muted-2); }
.mtx-pal-pp   { font-size: .68rem; color: var(--muted); margin-top: 2px; }

.mtx-pal.is-done {
  border-color: rgba(60, 255, 180, .35);
}
.mtx-pal.is-done .mtx-pal-week { color: var(--green); }

.mtx-pal.is-next {
  border-color: rgba(255, 140, 66, .4);
  background: #1a1006;
}
.mtx-pal.is-next .mtx-pal-week,
.mtx-pal.is-next .mtx-pal-pp { color: var(--orange); }

/* ===== Tag a droite de la barre d'etat ===== */
.mtx-daily-tag {
  font-family: var(--font-title);
  font-size: .8rem;
  letter-spacing: 3px;
  color: var(--red);
  padding: var(--space-1) var(--space-3);
  border: 1px solid rgba(255, 60, 110, .3);
  border-radius: var(--radius-pill);
}

/* Note reveal sous la grille */
.mtx-daily-note {
  text-align: center;
  font-size: .75rem;
  color: var(--muted);
  margin-top: var(--space-3);
}
.mtx-daily-note[hidden] { display: none; }

/* ===== Ecran de fin ===== */
.mtx-daily-done {
  text-align: center;
  padding: var(--space-6) var(--space-4) var(--space-2);
}
.mtx-daily-done.hidden { display: none; }
.mtx-daily-result {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 1.2rem;
  margin-bottom: var(--space-3);
}
.mtx-daily-result.is-win  { color: var(--green); }
.mtx-daily-result.is-lose { color: var(--red); }
.mtx-daily-result .pp   { color: var(--gold); }
.mtx-daily-result .word { color: var(--text); letter-spacing: 2px; }
.mtx-daily-next { font-size: .82rem; color: var(--muted-2); }
.mtx-daily-next b { color: var(--text); font-variant-numeric: tabular-nums; }

/* ===== Ecran de demarrage ===== */
.mtx-daily-start {
  text-align: center;
  padding: var(--space-10) var(--space-4);
}
.mtx-daily-start.hidden { display: none; }
.mtx-daily-start-icon {
  font-size: 2.4rem;
  margin-bottom: var(--space-3);
  line-height: 1;
}
.mtx-daily-start .btn { margin-top: var(--space-5); }

/* Reutilise .mtx-idle-title / .mtx-idle-sub / .mtx-login de motex.css */