/* ═══════════════════════════════════════════
   VARIABLES & RESET
═══════════════════════════════════════════ */
:root {
  --bg:      #0a0a0f;
  --s1:      #12121a;
  --s2:      #1a1a26;
  --s3:      #222233;
  --border:  #2a2a40;
  --accent:  #2b8ad6;
  --accent2: #5aa9e6;
  --accent2-cta: #1d79c0; /* variante assombrie de --accent2, réservée aux boutons .btn (texte blanc, contraste WCAG AA) */
  --blue:    #3d8bff;
  --green:   #2ecc71;
  --red:     #e74c3c;
  --yellow:  #f1c40f;
  --orange:  #e67e22;
  --text:    #f0f0f8;
  --muted:   #7c7c99;
}
[data-theme="light"] {
  --bg:      #f2f2f7;
  --s1:      #ffffff;
  --s2:      #e8e8f0;
  --s3:      #dcdcec;
  --border:  #ccccdc;
  --accent:  #1a6eb5;
  --accent2: #2580c8;
  --accent2-cta: #2379be;
  --blue:    #2570e8;
  --green:   #1fa055;
  --red:     #cc3328;
  --yellow:  #c07a00;
  --orange:  #c05a10;
  --text:    #0f0f1f;
  --muted:   #60607a;
}
*  { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent }
html, body { height: 100%; overflow: hidden }
body { font-family: 'DM Sans', sans-serif; background: var(--bg); color: var(--text); font-size: 15px }

/* ═══════════════════════════════════════════
   LAYOUT — SCREENS
═══════════════════════════════════════════ */
.screen          { position: fixed; inset: 0; display: none; flex-direction: column; overflow: hidden }
.screen.active   { display: flex }

/* ═══════════════════════════════════════════
   TOP BAR
═══════════════════════════════════════════ */
.topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: .7rem 1rem;
  background: var(--s1); border-bottom: 1px solid var(--border);
  flex-shrink: 0; gap: .5rem; position: relative;
}
.topbar-logo {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.5rem; letter-spacing: .05em;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.topbar-info  { font-size: .8rem; color: var(--muted); flex: 1; text-align: center }
.hamburger-btn {
  border: none; background: none; padding: .3rem .4rem; cursor: pointer;
  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px;
  min-width: 44px; min-height: 44px;
}
.hamburger-btn span { display: block; width: 18px; height: 2px; background: var(--muted); border-radius: 2px; transition: background .2s }
.hamburger-btn:hover span { background: var(--accent) }
.hamburger-menu {
  display: none; position: absolute; top: calc(100% + 4px); right: .5rem;
  background: var(--s1); border: 1px solid var(--border); border-radius: 14px;
  min-width: 190px; padding: .4rem; z-index: 200; box-shadow: 0 8px 24px rgba(0,0,0,.25);
}
.hamburger-menu.open { display: block }
.hmenu-item {
  display: flex; align-items: center; gap: .65rem;
  padding: .6rem .8rem; border-radius: 10px; cursor: pointer;
  font-size: .88rem; color: var(--text); background: none; border: none;
  width: 100%; text-align: left; font-family: 'DM Sans', sans-serif; min-height: 44px;
}
.hmenu-item:hover { background: var(--s2); color: var(--accent) }
.hmenu-separator  { height: 1px; background: var(--border); margin: .3rem 0 }

/* ═══════════════════════════════════════════
   SCROLL CONTENT
═══════════════════════════════════════════ */
.scroll { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 1rem; padding-bottom: 5rem }
.scroll::-webkit-scrollbar       { width: 4px }
.scroll::-webkit-scrollbar-track { background: transparent }
.scroll::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px }

/* ═══════════════════════════════════════════
   BOTTOM NAV
═══════════════════════════════════════════ */
.bottom-nav {
  display: flex; flex-shrink: 0;
  background: var(--s1); border-top: 1px solid var(--border);
}
.nav-btn {
  flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: .5rem .2rem; gap: 2px;
  background: none; border: none; color: var(--muted); cursor: pointer;
  font-family: 'DM Sans', sans-serif; font-size: .6rem; font-weight: 500; transition: color .2s;
}
.nav-btn .nav-icon  { font-size: 1.2rem }
.nav-btn.active     { color: var(--accent) }
.nav-btn.active .nav-icon { filter: drop-shadow(0 0 6px var(--accent)) }

/* ═══════════════════════════════════════════
   BOUTONS
═══════════════════════════════════════════ */
.btn {
  display: block; width: 100%; padding: .85rem;
  background: linear-gradient(135deg, var(--accent), var(--accent2-cta));
  border: none; border-radius: 12px;
  color: #fff; font-family: 'DM Sans', sans-serif; font-size: 1rem; font-weight: 700;
  cursor: pointer; transition: opacity .2s, transform .1s;
}
.btn:hover    { opacity: .9; transform: translateY(-1px) }
.btn:active   { transform: translateY(0) }
.btn:disabled { opacity: .35; cursor: not-allowed; transform: none }
.btn-outline  { background: none; border: 1px solid var(--border); color: var(--text) }
.btn-outline:hover { border-color: var(--accent); color: var(--accent) }
.btn-danger   { background: linear-gradient(135deg, var(--red), #c0392b) }
.btn-blue     { background: linear-gradient(135deg, var(--blue), #5b9fff) }
.btn-tall     { padding-top: 2.2rem; padding-bottom: 2.2rem; }
/* Boutons à appui long (section évaluation) : barre de remplissage + anti-tap */
.btn-longpress { position: relative; overflow: hidden; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.btn-longpress .eval-charge-bar { background: rgba(255,255,255,.35); transition: height .7s linear; border-radius: 0 0 12px 12px; }
.btn-longpress.pressing .eval-charge-bar { height: 100%; border-radius: 12px; }
.btn-sm {
  background: none; border: 1px solid var(--border); border-radius: 8px;
  color: var(--muted); font-family: 'DM Sans', sans-serif; font-size: .8rem;
  padding: .4rem .75rem; cursor: pointer; transition: all .2s;
}
.btn-sm:hover { border-color: var(--accent); color: var(--accent) }

/* ═══════════════════════════════════════════
   CARDS & SECTIONS
═══════════════════════════════════════════ */
.card         { background: var(--s1); border: 1px solid var(--border); border-radius: 14px; padding: 1rem; margin-bottom: .75rem }
.section-title {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; letter-spacing: .08em;
  color: var(--muted); margin: 1.25rem 0 .5rem;
  display: flex; align-items: center; gap: .5rem;
}
.section-title::after { content: ''; flex: 1; height: 1px; background: var(--border) }

/* ═══════════════════════════════════════════
   FORMULAIRES
═══════════════════════════════════════════ */
.field-label {
  font-size: .75rem; font-weight: 600; color: var(--muted);
  text-transform: uppercase; letter-spacing: .1em; margin-bottom: .4rem; display: block;
}
select,
input[type=text],
input[type=password],
input[type=number] {
  width: 100%; background: var(--s2); border: 1px solid var(--border); border-radius: 10px;
  color: var(--text); font-family: 'DM Sans', sans-serif; font-size: 1rem;
  padding: .7rem .9rem; outline: none; transition: border-color .2s;
  -webkit-appearance: none; appearance: none;
}
select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b6b8a' stroke-width='2' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .8rem center; padding-right: 2rem;
}
select:focus,
input:focus { border-color: var(--accent) }
input[type=number] { -moz-appearance: textfield }
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none }
.field { margin-bottom: 1rem }
.mdp-rules  { font-size: .72rem; color: var(--muted); margin-top: .35rem; line-height: 1.5 }
.error-msg  { color: var(--red); font-size: .8rem; margin-top: .5rem; display: none }

/* ═══════════════════════════════════════════
   ÉCRAN CONNEXION
═══════════════════════════════════════════ */
#screen-login {
  justify-content: center; align-items: center;
  background: radial-gradient(ellipse at 30% 40%, rgba(46,204,113,.08) 0%, transparent 60%),
              radial-gradient(ellipse at 70% 70%, rgba(61,139,255,.06) 0%, transparent 60%),
              var(--bg);
  padding: 1.5rem; overflow-y: auto;
}
.login-hero {
  text-align: center; margin-bottom: 2rem;
  position: relative; padding: 1rem 0;
}
.login-hero::before {
  content: '';
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -55%);
  width: 180px; height: 221px;
  background: url('chrono.png') center/contain no-repeat;
  opacity: .08;
  filter: invert(1);
  pointer-events: none;
  z-index: 0;
}
[data-theme="light"] .login-hero::before { filter: none; opacity: .07 }
.login-hero > * { position: relative; z-index: 1 }
.login-icon    { font-size: 5.5rem; line-height: 1; margin-bottom: .5rem }
.login-logo    {
  font-family: 'Bebas Neue', sans-serif; font-size: 2.8rem; letter-spacing: .04em; line-height: 1;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.login-sub     { font-size: .8rem; letter-spacing: .25em; text-transform: uppercase; color: var(--muted); margin-top: .25rem }
.login-card    {
  background: var(--s1); border: 1px solid var(--border); border-radius: 18px;
  padding: 1.5rem; width: 100%; max-width: 380px;
}
.login-card h2 { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: .05em; margin-bottom: 1.25rem }

/* ═══════════════════════════════════════════
   PAGE ACCUEIL / DASHBOARD
═══════════════════════════════════════════ */
.dashboard-hero {
  background: var(--s1); border: 1px solid var(--border); border-radius: 16px;
  padding: 1.25rem; margin-bottom: .75rem; text-align: center;
}
.dashboard-hero-name {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem; letter-spacing: .04em;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.dashboard-hero-projet { font-size: 1.1rem; color: var(--accent); margin-top: .15rem }
.hero-divider { border: none; border-top: 1px solid var(--border); margin: .75rem 0 }
.dashboard-hero-vma { margin-top: 0; line-height: 1; display: flex; align-items: baseline; justify-content: center; gap: .15em }
.dashboard-hero-vma-label { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--accent); letter-spacing: .05em }
.dashboard-hero-vma-arrow { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--muted) }
.dashboard-hero-vma-val { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--accent) }
.dashboard-hero-vma-unit { font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; color: var(--muted); letter-spacing: .05em }
.dashboard-badge-row {
  display: flex; align-items: center; justify-content: center; gap: .5rem;
  margin: .75rem 0 .25rem;
}
.dashboard-badge-emoji { font-size: 1.8rem; line-height: 1 }
.dashboard-badge-info  { text-align: left }
.dashboard-badge-label { font-size: .65rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em }
.dashboard-badge-name  { font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; letter-spacing: .05em }

.stat-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-bottom: .75rem;
}
.stat-card {
  background: var(--s1); border: 1px solid var(--border); border-radius: 12px;
  padding: .85rem; text-align: center;
}
.stat-card-full { grid-column: 1 / -1 }
.stat-card-val { font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; color: var(--accent) }
.stat-card-key { font-size: .7rem; color: var(--muted); text-transform: uppercase; letter-spacing: .07em; margin-top: .1rem }

.recup-info-banner {
  background: rgba(91,159,255,.1); border: 1px solid rgba(91,159,255,.35);
  border-radius: 10px; padding: .6rem 1rem; margin-top: .75rem;
  font-size: .85rem; color: var(--text); text-align: center;
}
.recup-info-banner strong { color: #5b9fff }

.cta-card {
  background: linear-gradient(135deg, rgba(46,204,113,.12), rgba(46,204,113,.04));
  border: 1px solid rgba(46,204,113,.3); border-radius: 16px;
  padding: 1.25rem; text-align: center; margin-bottom: .75rem;
}
.cta-card-title { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: .04em; margin-bottom: .4rem }
.cta-card-sub   { font-size: .85rem; color: var(--muted); margin-bottom: 1rem; line-height: 1.5 }
.cta-seance-desc { font-size: 1.15rem; font-weight: 700; color: var(--text); margin-bottom: 1rem; line-height: 1.4 }
.cycle-done-card {
  background: linear-gradient(135deg, rgba(241,196,15,.1), rgba(241,196,15,.03));
  border: 1px solid rgba(241,196,15,.3); border-radius: 16px;
  padding: 1.25rem; text-align: center; margin-bottom: .75rem;
}

/* ═══════════════════════════════════════════
   DEMI-COOPER
═══════════════════════════════════════════ */
.cooper-info {
  background: rgba(61,139,255,.09); border: 1px solid rgba(61,139,255,.22);
  border-radius: 12px; padding: .85rem 1rem; margin-bottom: 1rem;
  font-size: .88rem; line-height: 1.6;
}
.vma-result {
  background: rgba(46,204,113,.1); border: 1px solid rgba(46,204,113,.3);
  border-radius: 12px; padding: 1rem; text-align: center; margin-bottom: 1rem; display: none;
}
.vma-result-val   { font-family: 'Bebas Neue', sans-serif; font-size: 3rem; letter-spacing: .04em; color: var(--accent) }
.vma-result-label { font-size: .75rem; color: var(--muted); text-transform: uppercase; letter-spacing: .1em }

/* ═══════════════════════════════════════════
   SÉLECTION DE PROJET
═══════════════════════════════════════════ */
.projet-choice-card {
  background: var(--s1); border: 2px solid var(--border); border-radius: 16px;
  padding: 1rem; margin-bottom: .75rem; cursor: pointer; transition: all .2s;
}
.projet-choice-card:hover              { transform: translateY(-2px) }
.projet-choice-card.p1:hover           { border-color: var(--blue) }
.projet-choice-card.p2:hover           { border-color: var(--orange) }
.projet-choice-card.p3:hover           { border-color: var(--green) }
.projet-choice-card.selected           { border-color: var(--accent); border-width: 2.5px; background: rgba(46,204,113,.22); box-shadow: 0 0 0 3px rgba(46,204,113,.25) }
.projet-choice-card.selected::after    { content: '✓ Sélectionné'; display:block; margin-top:.5rem; font-size:.75rem; font-weight:700; color: var(--accent); text-transform:uppercase; letter-spacing:.06em }
.projet-choice-num    { font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem; line-height: 1 }
.projet-choice-num.p1 { color: var(--blue) }
.projet-choice-num.p2 { color: var(--orange) }
.projet-choice-num.p3 { color: var(--green) }
.projet-choice-nom  { font-weight: 700; font-size: .95rem; margin: .15rem 0 }
.projet-choice-int  { font-size: .78rem; color: var(--muted) }
.projet-choice-desc { font-size: .82rem; color: var(--text); line-height: 1.5; margin-top: .5rem }
.suggest-badge {
  display: inline-block; font-size: .68rem; font-weight: 700; padding: .15rem .5rem;
  border-radius: 20px; background: rgba(46,204,113,.12); color: var(--accent);
  border: 1px solid rgba(46,204,113,.3); margin-bottom: .25rem;
}

/* ═══════════════════════════════════════════
   PAGE MON PROJET
═══════════════════════════════════════════ */
.projet-card-list { background: var(--s1); border: 1px solid var(--border); border-radius: 14px; padding: 1rem 1.1rem; margin-bottom: .75rem; transition: border-color .15s }
.projet-card-list:active { opacity: .85 }
.projet-card-list.projet-card-mine { border-color: var(--accent) }
.projet-card-list.selected         { border-color: var(--accent); border-width: 2.5px; background: rgba(46,204,113,.22); box-shadow: 0 0 0 3px rgba(46,204,113,.25) }
.projet-card-list.selected::after  { content: '✓ Sélectionné'; display:block; margin-top:.5rem; font-size:.75rem; font-weight:700; color: var(--accent); text-transform:uppercase; letter-spacing:.06em }
.projet-card-list.blue:hover   { border-color: var(--blue) }
.projet-card-list.orange:hover { border-color: var(--orange) }
.projet-card-list.green:hover  { border-color: var(--accent) }
.projet-card-list-header { display: flex; align-items: center; gap: .5rem; margin-bottom: .3rem }
.projet-card-list-icon   { font-size: 1.3rem; line-height: 1 }
.projet-card-list-title  { font-weight: 700; font-size: .95rem; flex: 1 }
.projet-card-list-badge  { font-size: .65rem; background: var(--accent); color: #fff; border-radius: 20px; padding: .15rem .55rem; text-transform: uppercase; letter-spacing: .05em; white-space: nowrap }
.projet-card-list-intensite { font-size: .75rem; color: var(--muted); margin-bottom: .4rem }
.projet-card-list-desc   { font-size: .82rem; color: var(--muted); line-height: 1.5 }

.projet-fiche     { background: var(--s1); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; margin-bottom: 1rem }
.fiche-header     { background: linear-gradient(135deg, var(--accent), var(--accent2)); padding: 1.25rem }
.fiche-header h2  { font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem; letter-spacing: .05em; color: #fff }
.fiche-header p   { font-size: .88rem; color: rgba(255,255,255,.9); margin-top: .2rem }
.fiche-header.blue   { background: linear-gradient(135deg, var(--blue), #5b9fff) }
.fiche-header.orange { background: linear-gradient(135deg, var(--orange), #f39c12) }
.fiche-header.green  { background: linear-gradient(135deg, #1abc9c, var(--green)) }
.fiche-body       { padding: 1rem 1.25rem }
.fiche-desc       { font-size: .88rem; line-height: 1.7; margin-bottom: 1rem }
.fiche-benefices  { list-style: none; margin-bottom: 1rem }
.fiche-benefices li {
  display: flex; gap: .6rem; margin-bottom: .4rem;
  font-size: .85rem; align-items: flex-start;
}
.fiche-benefices li::before { content: '✓'; color: var(--accent); font-weight: 700; flex-shrink: 0 }
.structure-list   { list-style: none }
.structure-list li {
  font-size: .82rem; color: var(--muted); padding: .35rem 0;
  border-bottom: 1px solid var(--border); display: flex; gap: .6rem; align-items: center;
}
.structure-list li:last-child { border-bottom: none }
.structure-list li strong     { color: var(--text) }
.structure-seance-num {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.05rem; color: var(--accent);
  width: 26px; flex-shrink: 0;
}

/* ═══════════════════════════════════════════
   PAGE SÉANCE
═══════════════════════════════════════════ */
.seance-header-card {
  background: var(--s1); border: 1px solid var(--border); border-radius: 14px;
  padding: 1.1rem; margin-bottom: 1rem;
}
.seance-num-label {
  font-size: .95rem; font-weight: 600; letter-spacing: .02em;
  color: var(--text); line-height: 1; margin-bottom: .1rem;
}
.seance-subtitle {
  font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem; letter-spacing: .03em;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  line-height: 1.1; margin-top: .15rem;
}
.seance-seq-label {
  margin-top: .7rem; text-align: center;
  font-size: 1.05rem; font-weight: 700; color: var(--accent);
  letter-spacing: .04em;
  background: rgba(46,204,113,.1); border-radius: 8px;
  padding: .35rem .6rem; display: inline-block; width: 100%; box-sizing: border-box;
}
.seance-structure-hint {
  font-size: .82rem; color: var(--muted); margin-top: .35rem; font-weight: 500;
}
.seq-prepare-item {
  background: var(--s2); border: 1px solid var(--border); border-radius: 10px;
  padding: .65rem .9rem; margin-bottom: .4rem;
  display: flex; align-items: center; justify-content: space-between;
}
.seq-prepare-label { font-size: .82rem; color: var(--muted) }
.seq-prepare-dist  { color: var(--accent); font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem }

/* Chronomètre */
.chrono-card {
  background: none; border: none;
  padding: 0; text-align: center; margin-bottom: 1rem;
  position: relative;
  min-height: 225px; display: flex; flex-direction: column; align-items: center; justify-content: center;
}
@media (min-width: 480px) { .chrono-card { min-height: 260px } }
.chrono-card::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -58%);
  width: 180px; height: 221px;
  background: url('chrono.png') no-repeat center / contain;
  opacity: .15; pointer-events: none; filter: invert(1);
}
[data-theme="light"] .chrono-card::before { filter: none; opacity: .12 }
@media (min-width: 480px) {
  .chrono-card::before { width: 210px; height: 258px }
}
.chrono-card.running { }
.chrono-card.recup   { }
.chrono-phase-label  {
  font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em;
  color: var(--muted); margin-bottom: .5rem;
}
.chrono-phase-label.running { color: var(--accent) }
.chrono-phase-label.recup   { color: var(--blue) }
.chrono-seq-info    { font-size: .82rem; color: var(--muted); margin-bottom: .75rem }
.chrono-display     {
  font-family: 'Bebas Neue', sans-serif; font-size: 5rem; letter-spacing: .04em; line-height: 1;
}
.chrono-display.running  { color: var(--accent) }
.chrono-display.recup    { color: var(--blue) }
.chrono-display.overtime { color: var(--red) }
.chrono-objectif    { font-size: .78rem; color: var(--muted); margin-top: .5rem }
.chrono-objectif span { color: var(--text); font-weight: 700 }

/* P3 */
.p3-block-badge {
  display: inline-block; font-family: 'Bebas Neue', sans-serif; font-size: 1.5rem;
  letter-spacing: .05em; padding: .4rem 1.2rem; border-radius: 10px; color: #fff; margin-bottom: .5rem;
}
.p3-block-badge.course { background: var(--accent) }
.p3-block-badge.marche { background: var(--blue) }
.p3-progress-track { height: 6px; background: var(--s2); border-radius: 3px; overflow: hidden; margin: .5rem 0 }
.p3-progress-fill  {
  height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent2));
  border-radius: 3px; transition: width .5s linear;
}
.p3-cycle-info  { font-size: .78rem; color: var(--muted); text-align: center; margin-bottom: .75rem }
.p3-subchrono-label { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin-bottom: .15rem }
.p3-subchrono { font-family: 'Bebas Neue', sans-serif; font-size: 3.8rem; letter-spacing: .04em; line-height: 1; margin-bottom: .15rem }
.p3-subchrono.course { color: var(--accent) }
.p3-subchrono.marche { color: var(--blue) }
.p3-speed-hint { font-size: .8rem; color: var(--muted); margin-bottom: .6rem }
.p3-speed-hint strong { color: var(--text) }
.p3-total-sep { width: 50%; border-top: 1px solid var(--border); margin: .5rem auto .4rem }

/* Saisie distance */
.saisie-card       { background: var(--s1); border: 1px solid var(--border); border-radius: 14px; padding: 1rem; margin-bottom: 1rem }
.saisie-title      { font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; letter-spacing: .04em; margin-bottom: .75rem }
.saisie-objectif   {
  background: var(--s2); border-radius: 10px; padding: .6rem .9rem;
  font-size: .82rem; color: var(--muted); margin-bottom: .75rem;
}
.saisie-objectif span { color: var(--accent); font-weight: 700 }
.distance-input-wrap  {
  display: flex; align-items: center; gap: .75rem; margin-bottom: .75rem;
}
.distance-input-wrap input {
  flex: 1; font-size: 1.8rem; font-family: 'Bebas Neue', sans-serif;
  text-align: center; padding: .6rem;
}
.distance-unit { font-size: .85rem; color: var(--muted); font-weight: 600; white-space: nowrap }

/* Écart */
.ecart-card        { border-radius: 10px; padding: .75rem 1rem; margin-bottom: .75rem; text-align: center }
.ecart-card.good   { background: rgba(46,204,113,.1);  border: 1px solid rgba(46,204,113,.3) }
.ecart-card.medium { background: rgba(241,196,15,.1);  border: 1px solid rgba(241,196,15,.3) }
.ecart-card.bad    { background: rgba(231,76,60,.08);  border: 1px solid rgba(231,76,60,.25) }
.ecart-pct         { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; letter-spacing: .04em }
.ecart-pct.good    { color: var(--green) }
.ecart-pct.medium  { color: var(--yellow) }
.ecart-pct.bad     { color: var(--red) }
.ecart-label       { font-size: .75rem; color: var(--muted); margin-top: .1rem }

/* Ressenti */
.ressenti-row { display: flex; gap: .5rem; margin-bottom: 1rem }
.ressenti-btn-large {
  flex: 1; padding: .85rem .4rem; border-radius: 10px;
  border: 2px solid var(--border); background: var(--s2);
  color: var(--muted); font-family: 'DM Sans', sans-serif; font-size: .82rem; font-weight: 700;
  cursor: pointer; transition: all .15s; text-align: center;
}
.ressenti-btn-large:hover  { border-color: var(--accent); color: var(--text) }
.ressenti-btn-large.sel-F  { background: rgba(61,139,255,.12); border-color: var(--blue);  color: var(--blue) }
.ressenti-btn-large.sel-D  { background: rgba(46,204,113,.12); border-color: var(--green); color: var(--green) }
.ressenti-btn-large.sel-TD { background: rgba(231,76,60,.1);   border-color: var(--red);   color: var(--red) }

/* Bilan */
.bilan-badge-card {
  text-align: center; padding: 1.5rem 1rem; margin-bottom: 1rem;
  background: var(--s1); border: 2px solid var(--border); border-radius: 18px;
  cursor: pointer; transition: border-color .2s;
}
.bilan-badge-emoji { font-size: 5rem; line-height: 1; margin-bottom: .5rem }
.bilan-badge-name  { font-family: 'Bebas Neue', sans-serif; font-size: 2.5rem; letter-spacing: .06em }
.bilan-stats-grid  { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-bottom: 1rem }
.bilan-stat        { background: var(--s2); border-radius: 10px; padding: .65rem .75rem; text-align: center }
.bilan-stat-val    { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; color: var(--accent) }
.bilan-stat-key    { font-size: .68rem; color: var(--muted); text-transform: uppercase; letter-spacing: .07em }
.bilan-seq-row {
  display: grid;
  grid-template-columns: 24px 1fr auto auto;
  align-items: center; gap: 0 .5rem;
  padding: .5rem 0; border-bottom: 1px solid var(--border); font-size: .82rem;
}
.bilan-seq-row:last-child { border-bottom: none }
.bilan-seq-num  { color: var(--muted); font-weight: 700 }
.bilan-seq-dist { font-weight: 700 }
.bilan-seq-ecart { font-size: .75rem; text-align: right }
.bilan-seq-ecart.good   { color: var(--green) }
.bilan-seq-ecart.medium { color: var(--yellow) }
.bilan-seq-ecart.bad    { color: var(--red) }
.bilan-seq-vma  { font-size: .75rem; color: var(--muted); text-align: right; white-space: nowrap }

/* ═══════════════════════════════════════════
   PAGE PROGRESSION — SVG
═══════════════════════════════════════════ */
.progression-chart {
  background: var(--s1); border: 1px solid var(--border); border-radius: 14px;
  padding: 1rem; margin-bottom: 1rem;
}
.progression-chart-title {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; letter-spacing: .05em; margin-bottom: .75rem;
}
.chart-svg { width: 100%; height: auto; display: block }
.progression-chart-canvas { height: 180px; position: relative; margin-bottom: .25rem }
.chart-legend {
  display: flex; gap: 1.25rem; font-size: .72rem; color: var(--muted); margin-top: .75rem; flex-wrap: wrap;
}
.chart-legend-item { display: flex; align-items: center; gap: .4rem }
.chart-legend-dash { width: 20px; border-top: 2px dashed var(--muted) }
.chart-legend-line { width: 20px; height: 2px; background: var(--accent) }
.progression-seance-row {
  background: var(--s1); border: 1px solid var(--border); border-radius: 10px;
  padding: .75rem 1rem; margin-bottom: .4rem;
  display: flex; align-items: center; gap: .75rem;
}
.prog-seq-num  { font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; color: var(--muted); width: 28px }
.prog-seq-info { flex: 1 }
.prog-seq-dist { font-weight: 700; font-size: .9rem }
.prog-seq-date { font-size: .72rem; color: var(--muted) }
.prog-seq-badge { font-size: 1.3rem }

/* ═══════════════════════════════════════════
   PAGE TUTORIEL
═══════════════════════════════════════════ */
.tuto-step {
  background: var(--s1); border: 1px solid var(--border); border-radius: 12px;
  padding: .9rem 1rem; margin-bottom: .6rem; display: flex; gap: .85rem; align-items: flex-start;
}
.tuto-step-num {
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  color: #fff; font-weight: 700; font-size: .82rem;
  min-width: 1.6rem; height: 1.6rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.tuto-step-content { font-size: .87rem; line-height: 1.55 }
.tuto-step-title   { font-weight: 700; margin-bottom: .2rem }
.tuto-alert        { border-radius: 10px; padding: .75rem 1rem; margin: .6rem 0; font-size: .85rem; line-height: 1.5 }
.tuto-alert.green  { background: rgba(46,204,113,.08); border: 1px solid rgba(46,204,113,.3) }
.tuto-alert.blue   { background: rgba(61,139,255,.08);  border: 1px solid rgba(61,139,255,.3) }
.tuto-alert.yellow { background: rgba(241,196,15,.08);  border: 1px solid rgba(241,196,15,.3) }
.tuto-alert strong { color: var(--accent) }
.tuto-alert.blue strong   { color: var(--blue) }
.tuto-alert.yellow strong { color: var(--yellow) }
/* Toggle iOS */
.ios-toggle { display:inline-block; position:relative; width:44px; height:26px; flex-shrink:0 }
.ios-toggle input { opacity:0; width:0; height:0; position:absolute }
.ios-toggle-track {
  position:absolute; inset:0; border-radius:13px; cursor:pointer;
  background:var(--s2); transition:background .2s;
}
.ios-toggle-track::after {
  content:''; position:absolute; top:3px; left:3px;
  width:20px; height:20px; border-radius:50%;
  background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.3);
  transition:transform .2s;
}
.ios-toggle input:checked + .ios-toggle-track { background:var(--accent) }
.ios-toggle input:checked + .ios-toggle-track::after { transform:translateX(18px) }

.bip-row {
  display:flex; align-items:center; justify-content:space-between;
  background:var(--s1); border:1.5px solid var(--border); border-radius:10px;
  padding:.6rem .9rem; margin-bottom:.75rem;
}
.bip-row-label { font-size:.85rem; font-weight:600; color:var(--text) }
.bip-row-sub   { font-size:.75rem; color:var(--muted) }

.eval-note-hint {
  border-left: 3px solid var(--accent); background: var(--s1);
  border-radius: 0 10px 10px 0; padding: .65rem .9rem; margin: .6rem 0;
}
.eval-note-hint-title {
  font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--muted); margin-bottom: .45rem;
}
.eval-note-hint-row { font-size: .83rem; margin-bottom: .35rem }
.eval-note-hint-row:last-child { margin-bottom: 0 }
.eval-note-pts { display: block; font-size: .75rem; font-weight: 700; color: var(--accent) }
.ressource-header {
  display: flex; align-items: center; gap: .5rem;
  margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: 1px solid var(--border);
}
.ressource-title { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: .05em }

/* ═══════════════════════════════════════════
   PAGE PROGRAMME
═══════════════════════════════════════════ */
.prog-projet-card {
  background: var(--s1); border: 1px solid var(--border); border-radius: 14px;
  padding: 1rem; margin-bottom: 1rem; overflow: hidden;
}
.prog-color-blue   { border-left: 4px solid var(--blue) }
.prog-color-orange { border-left: 4px solid var(--orange) }
.prog-color-green  { border-left: 4px solid var(--green) }
.prog-projet-header {
  display: flex; align-items: center; gap: .75rem; margin-bottom: .85rem;
}
.prog-projet-icon   { font-size: 1.6rem; line-height: 1 }
.prog-projet-nom    { font-weight: 700; font-size: .95rem }
.prog-projet-intensite { font-size: .78rem; color: var(--muted); margin-top: .1rem }
.prog-mon-projet {
  margin-left: auto; font-size: .72rem; font-weight: 700; color: var(--accent);
  background: rgba(46,204,113,.1); border: 1px solid var(--accent);
  border-radius: 20px; padding: .2rem .6rem; white-space: nowrap;
}
.prog-seances { display: flex; flex-direction: column; gap: .35rem }
.prog-seance-row {
  display: flex; align-items: baseline; gap: .6rem;
  font-size: .85rem; padding: .35rem .5rem; border-radius: 8px; background: var(--s2);
}
.prog-seance-num   { font-family: 'Bebas Neue', sans-serif; font-size: .95rem; color: var(--accent); flex-shrink: 0; width: 1.6rem }
.prog-seance-desc  { flex: 1; line-height: 1.4 }
.prog-seance-total { color: var(--muted); font-size: .8rem }
/* ─── Échauffement / retour au calme ─────────────── */
.echauff-steps { display: flex; flex-direction: column; gap: .5rem }
.echauff-step  {
  display: flex; align-items: flex-start; gap: .7rem;
  background: var(--s2); border-radius: 10px; padding: .6rem .85rem;
  font-size: .88rem; line-height: 1.5;
}
.echauff-step-num {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem;
  color: var(--accent); flex-shrink: 0; width: 1.1rem; line-height: 1.4;
}
.echauff-step-sprint { border: 1px dashed var(--border) }

.prog-retour-calme {
  margin-top: .5rem; padding: .6rem .75rem;
  background: rgba(230,126,34,.08); border: 1px solid rgba(230,126,34,.25);
  border-radius: 8px;
}
.prog-retour-calme-label { font-size: .75rem; font-weight: 700; color: var(--orange); text-transform: uppercase; letter-spacing: .06em; margin-bottom: .35rem }
.prog-retour-calme-item  { font-size: .83rem; color: var(--text); line-height: 1.5 }
.prog-retour-calme-item::before { content: '• '; color: var(--orange) }

/* ═══════════════════════════════════════════
   TOAST
═══════════════════════════════════════════ */
.toast {
  position: fixed; top: 1rem; left: 50%; transform: translateX(-50%) translateY(-80px);
  background: var(--green); color: #fff; font-weight: 700; font-size: .9rem;
  padding: .55rem 1.25rem; border-radius: 30px; z-index: 999;
  transition: transform .3s cubic-bezier(.34,1.56,.64,1); white-space: nowrap; pointer-events: none;
}
.toast.show  { transform: translateX(-50%) translateY(0) }
.toast.error { background: var(--red) }
.toast.warn  { background: var(--orange) }

/* ═══════════════════════════════════════════
   LOADING / OVERLAYS
═══════════════════════════════════════════ */
.overlay {
  position: fixed; inset: 0; background: rgba(8,15,8,.88);
  display: flex; align-items: center; justify-content: center; z-index: 200;
}
.overlay.hidden { display: none }
.spinner {
  width: 32px; height: 32px; border: 3px solid rgba(46,204,113,.2);
  border-top-color: var(--accent); border-radius: 50%; animation: spin .7s linear infinite;
}
@keyframes spin  { to { transform: rotate(360deg) } }
@keyframes pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(61,139,255,.5) } 50% { box-shadow: 0 0 0 12px rgba(61,139,255,0) } }
.btn-pulse { animation: pulse 1.6s ease-in-out infinite }

/* ═══════════════════════════════════════════
   MODAL
═══════════════════════════════════════════ */
.modal-bg        { position: fixed; inset: 0; background: rgba(0,0,0,.7); display: flex; align-items: center; justify-content: center; z-index: 300; padding: 1rem }
.modal-bg.hidden { display: none }
.modal           { background: var(--s1); border: 1px solid var(--border); border-radius: 18px; padding: 1.5rem; max-width: 340px; width: 100%; position: relative }
.modal h3        { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; margin-bottom: .5rem }
.modal p         { font-size: .85rem; color: var(--muted); line-height: 1.5; margin-bottom: 1.25rem }
.modal-actions   { display: flex; gap: .75rem }
.modal-actions .btn { flex: 1; padding: .7rem }

/* ═══════════════════════════════════════════
   UTILITAIRES
═══════════════════════════════════════════ */
.no-data-msg { text-align: center; color: var(--muted); padding: 2rem 1rem; font-size: .88rem; line-height: 1.6 }
.info-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: .5rem 0; border-bottom: 1px solid var(--border); font-size: .85rem;
}
.info-row:last-child { border-bottom: none }
.info-row-key { color: var(--muted) }
.info-row-val { font-weight: 700 }

/* ═══════════════════════════════════════════
   PAGE ÉVALUATION FINALE
═══════════════════════════════════════════ */

/* Carte d'accès évaluation (accueil) */
.eval-cta-card {
  background: linear-gradient(135deg, rgba(46,204,113,.12), rgba(46,204,113,.04));
  border: 1.5px solid rgba(46,204,113,.4);
  border-radius: 14px; padding: 1.1rem; margin-bottom: .75rem;
}
.eval-cta-title {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; letter-spacing: .05em;
  color: var(--accent); margin-bottom: .25rem;
}
.eval-cta-sub { font-size: .82rem; color: var(--muted); margin-bottom: .8rem; line-height: 1.4 }

/* Grille choix de rôle */
.eval-role-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-bottom: 1rem }
/* Header étape 1 */
.eval-header-top  { display: flex; align-items: flex-start; gap: .55rem }
.eval-header-medal { font-size: 2rem; line-height: 1.1; flex-shrink: 0 }
.eval-header-text  { display: flex; flex-direction: column; gap: .15rem }
.eval-header-meta  { font-size: .85rem; color: var(--muted); font-weight: 600; margin-top: .2rem }

/* Boutons rôle — pleine largeur empilés */
.eval-role-stack { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 1rem }
.eval-role-btn-full {
  width: 100%; padding: 1.3rem 1.2rem;
  border: none; border-radius: 16px; cursor: pointer;
  display: flex; align-items: center; gap: 1rem;
  transition: opacity .15s, transform .1s;
  -webkit-tap-highlight-color: transparent;
}
.eval-role-btn-full:active { transform: scale(.98); opacity: .9 }
.eval-role-coureur {
  background: linear-gradient(135deg, #f97316, #fb923c);
  box-shadow: 0 4px 14px rgba(249,115,22,.35);
}
.eval-role-obs {
  background: linear-gradient(135deg, #2563eb, #3b82f6);
  box-shadow: 0 4px 14px rgba(37,99,235,.35);
}
.eval-role-btn-full .eval-role-icon  { font-size: 2.4rem; line-height: 1; flex-shrink: 0 }
.eval-role-text  { display: flex; flex-direction: column; align-items: flex-start; gap: .15rem }
.eval-role-btn-full .eval-role-label { font-size: 1.25rem; font-weight: 800; color: #fff; line-height: 1 }
.eval-role-sub   { font-size: .8rem; color: rgba(255,255,255,.8); font-weight: 500 }
.eval-role-btn {
  background: var(--s1); border: 1.5px solid var(--border); border-radius: 14px;
  padding: 1.5rem .75rem; display: flex; flex-direction: column; align-items: center;
  gap: .6rem; cursor: pointer; transition: border-color .2s, background .2s;
  font-family: 'DM Sans', sans-serif; color: var(--text);
}
.eval-role-btn:hover  { border-color: var(--accent); background: var(--s2) }
.eval-role-btn.active { border-color: var(--accent); background: rgba(46,204,113,.08) }
.eval-role-icon { font-size: 2.2rem; line-height: 1 }
.eval-role-label { font-size: .95rem; font-weight: 700 }

/* Grille choix de contrat P3 */
.eval-contrat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-bottom: .75rem }
.eval-contrat-btn {
  display: flex; flex-direction: column; align-items: center; gap: .25rem;
  border: 1.5px solid var(--border); border-radius: 12px; padding: .75rem .5rem;
  cursor: pointer; transition: border-color .2s, background .2s;
  text-align: center;
}
.eval-contrat-btn:has(input:checked) { border-color: var(--accent); background: rgba(46,204,113,.08) }
.eval-contrat-btn input { display: none }
.eval-contrat-label { font-size: 1rem; font-weight: 800; color: var(--accent) }
.eval-contrat-duree { font-size: .85rem; font-weight: 700; color: var(--text) }
.eval-contrat-note  { font-size: .72rem; color: var(--muted) }

/* Slots P2 — choix stratégie coureur */
.p2-slot-card { border: 1.5px solid var(--border); border-radius: 12px; padding: .75rem; margin-bottom: .5rem }
.p2-slot-label { font-size: .78rem; font-weight: 700; color: var(--muted); margin-bottom: .4rem }
.p2-slot-btns { display: flex; gap: .5rem }
.p2-slot-btn {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: .2rem;
  border: 1.5px solid var(--border); border-radius: 10px; padding: .6rem .4rem;
  background: none; cursor: pointer; transition: border-color .15s, background .15s;
}
.p2-slot-btn.selected { border-color: var(--accent); background: rgba(46,204,113,.08) }
.p2-slot-pct { font-size: .9rem; font-weight: 800; color: var(--accent) }
.p2-slot-info { font-size: .7rem; color: var(--muted); text-align: center }

/* Carte coureur (observer setup) */
/* Carte élève observé (step 2 obs) */
/* Résumé paramètres validés */
.eval-params-resume-card {
  background: rgba(46,204,113,.1); border: 1px solid rgba(46,204,113,.3);
  border-radius: 10px; padding: .65rem .9rem;
  font-size: .9rem; color: var(--text); margin-bottom: .75rem;
}

.eval-eleve-card   { margin-bottom: .75rem }
.eval-eleve-tag    { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: .35rem }
.eval-eleve-name   { font-family: 'Bebas Neue', sans-serif; font-size: 1.9rem; line-height: 1; color: var(--text); margin-bottom: .5rem }
.eval-eleve-data   { font-size: .88rem; color: var(--text); margin-bottom: .2rem; line-height: 1.4 }
.eval-eleve-objectif { margin-top: .4rem; padding-top: .4rem; border-top: 1px solid var(--border); color: var(--accent); font-weight: 600 }

/* Ancienne carte (gardée pour compatibilité) */
.eval-coureur-card {
  background: var(--s2); border: 1px solid var(--border); border-radius: 12px;
  padding: .9rem 1rem; margin-bottom: .75rem;
}
.eval-coureur-name { font-size: 1.05rem; font-weight: 700; margin-bottom: .3rem }
.eval-coureur-hint {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: .04em;
  color: var(--accent); line-height: 1.1; margin: .4rem 0 .2rem;
}
.eval-coureur-allure { font-size: .82rem; color: var(--muted) }

/* Chrono — compteur */
/* Indicateur séquence P2 */
.eval-seq-ind {
  text-align: center; font-size: 1rem; font-weight: 700;
  color: var(--accent); margin: .4rem 0 .1rem;
  padding: .3rem .6rem; border-radius: 8px;
  background: rgba(46,204,113,.1);
}
.eval-seq-ind.recup  { color: var(--orange); background: rgba(249,115,22,.1) }
.eval-seq-ind.pret   { color: #2563eb;       background: rgba(37,99,235,.1) }
.eval-seq-ind.done   { color: var(--muted);  background: var(--s2) }

/* Bouton démarrer séquence suivante */
.eval-btn-demarrer-seq {
  width: 100%; padding: 1.1rem; font-size: 1.1rem; font-weight: 700;
  background: #2563eb; color: #fff; border: none; border-radius: 14px;
  cursor: pointer; margin-bottom: .5rem;
  box-shadow: 0 4px 14px rgba(37,99,235,.35);
}

.eval-timer {
  text-align: center; margin: .6rem 0 .2rem;
  font-family: 'Bebas Neue', sans-serif; font-size: 3rem; letter-spacing: .06em;
  color: var(--accent); line-height: 1;
}
.eval-timer.recup { color: #dc2626 }
.eval-timer-target {
  font-size: 1.6rem; color: var(--muted); margin-left: .25rem;
}
.eval-counters {
  text-align: center; margin: .25rem 0 .4rem;
  font-family: 'Bebas Neue', sans-serif; font-size: 2rem; letter-spacing: .04em;
  color: var(--text); line-height: 1;
}
.eval-last-seg {
  text-align: center; font-size: .9rem; color: var(--accent);
  font-weight: 600; min-height: 1.3rem; margin-bottom: .6rem;
}

/* Infos contexte dans les headers éval (pas de fond vert) */
.eval-header-info {
  font-size: .88rem; color: var(--text); margin-top: .3rem;
  font-weight: 500; opacity: .8; line-height: 1.4;
}

/* Bouton PASSAGE — appui long */
.eval-passage-btn {
  width: 100%; min-height: calc(50vh - 130px);
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  border: none; border-radius: 18px; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .5rem; transition: background .05s;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  position: relative; overflow: hidden;
}
.eval-passage-btn:disabled {
  background: var(--s3); cursor: not-allowed;
}
.eval-passage-btn.flashed {
  background: #fff; /* flash blanc immédiat */
}
/* Barre de charge (appui long) */
.eval-charge-bar {
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 0; border-radius: 0 0 18px 18px;
  background: rgba(220,38,38,.6);
  transition: height 1s linear;
  pointer-events: none;
}
.eval-passage-btn.pressing .eval-charge-bar {
  height: 100%; border-radius: 18px;
  transition: height 1s linear;
}
.eval-passage-label {
  font-family: 'Bebas Neue', sans-serif; font-size: 2.8rem; letter-spacing: .08em;
  color: #fff; line-height: 1; pointer-events: none;
}
.eval-passage-sub {
  font-size: 1rem; font-weight: 700; color: rgba(255,255,255,.8);
  pointer-events: none;
}
.eval-passage-btn:disabled .eval-passage-label,
.eval-passage-btn:disabled .eval-passage-sub { color: var(--muted) }

/* Appui long sur tous les boutons .btn-pulse (départ chrono) */
.btn-pulse.pressing {
  animation: none;
  -webkit-tap-highlight-color: transparent;
}
.btn-pulse.pressing .eval-charge-bar {
  height: 100%; border-radius: 12px;
  transition: height 1s linear;
}

/* Bouton démarrer chrono (observateur) — appui long */
.eval-lancer-btn {
  width: 100%; padding: 2.4rem 1rem;
  font-size: 1.15rem; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, var(--blue), #5b9fff);
  border: none; border-radius: 14px; cursor: pointer;
  position: relative; overflow: hidden;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  transition: opacity .15s;
}
.eval-lancer-btn.pressing .eval-charge-bar {
  height: 100%; border-radius: 14px;
  transition: height 1s linear;
}

/* Bouton phase (Pause / Reprise) */
.eval-phase-btn {
  width: 100%; padding: .9rem; border-radius: 12px; border: none;
  font-family: 'DM Sans', sans-serif; font-size: 1rem; font-weight: 700;
  cursor: pointer; transition: background .15s, color .15s;
  margin-top: .5rem;
}
.eval-phase-btn.en-course {
  background: rgba(46,204,113,.15); color: var(--accent); border: 1.5px solid var(--accent);
}
.eval-phase-btn.en-recup {
  background: rgba(107,107,138,.15); color: var(--muted); border: 1.5px solid var(--border);
}

/* Bilan — note */
.eval-note-block {
  text-align: center; padding: 1.25rem 0 .75rem;
}
.eval-note-big {
  font-family: 'Bebas Neue', sans-serif; font-size: 5rem; line-height: 1;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.eval-note-denom { font-size: 2.5rem }
.eval-note-detail {
  font-size: .9rem; color: var(--muted); margin-top: .35rem; font-weight: 600;
}

/* Graph SVG */
.eval-graph-wrap { margin: .5rem 0 .75rem; height: 200px; position: relative }
.eval-graph-wrap canvas { display: block; width: 100% !important }

.split-table { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px; margin-top: .4rem }
.split-sep { grid-column: 1 / -1; font-size: .72rem; color: var(--muted); text-align: center; padding: .2rem 0; letter-spacing: .04em }
.split-cell { background: var(--s2); border-radius: 4px; padding: .3rem .2rem; text-align: center; font-size: .8rem; font-variant-numeric: tabular-nums }
.split-cell.exclu { color: #ef4444 }
.split-legend { font-size: .7rem; color: var(--muted); margin-top: .4rem; text-align: center }

/* ══ Page lexique (SPA) ══════════════════════════════════════════ */
#page-lexique { padding: 1rem 1rem 4rem; }
#page-lexique .lex-inner { max-width: 720px; margin: 0 auto; }
#page-lexique .doc-header { text-align:center; margin-bottom:1.5rem; padding-bottom:1.25rem; border-bottom:1px solid var(--border); }
#page-lexique .doc-header .logo { font-family:'Bebas Neue',sans-serif; font-size:2rem; letter-spacing:.06em; background:linear-gradient(135deg,var(--accent),var(--accent2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
#page-lexique .doc-header .subtitle { font-size:.82rem; color:var(--muted); margin-top:.2rem; }
#page-lexique .doc-header .doc-title { font-family:'Bebas Neue',sans-serif; font-size:1.4rem; letter-spacing:.05em; color:var(--text); margin-top:.75rem; }
#page-lexique .nav-sections { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1.5rem; }
#page-lexique .nav-pill { background:rgba(61,139,255,.12); border:1px solid rgba(61,139,255,.35); border-radius:20px; color:var(--blue); font-size:.78rem; font-weight:600; padding:.3rem .75rem; cursor:pointer; text-decoration:none; transition:all .15s; }
#page-lexique .nav-pill:hover { background:rgba(61,139,255,.22); border-color:var(--blue); }
#page-lexique .lex-section { margin-bottom:2rem; }
#page-lexique .section-header { display:flex; align-items:center; gap:.6rem; font-family:'Bebas Neue',sans-serif; font-size:1.35rem; letter-spacing:.05em; color:var(--accent); margin-bottom:.85rem; padding-bottom:.45rem; border-bottom:2px solid var(--border); }
#page-lexique .section-icon { width:28px; height:28px; background:linear-gradient(135deg,var(--accent),var(--accent2)); border-radius:7px; display:flex; align-items:center; justify-content:center; font-size:.9rem; flex-shrink:0; }
#page-lexique .terme { background:var(--s1); border:1px solid var(--border); border-radius:12px; padding:.7rem .9rem; margin-bottom:.5rem; transition:border-color .15s; }
#page-lexique .terme:hover { border-color:var(--accent); }
#page-lexique .terme-highlight { border-left:3px solid var(--accent); }
#page-lexique .terme-nom { font-weight:700; color:var(--accent); font-size:1rem; letter-spacing:.01em; margin-bottom:.25rem; }
#page-lexique .terme-def { color:var(--text); font-size:.86rem; line-height:1.6; padding-left:.5rem; }
#page-lexique .terme-exemple { margin-top:.5rem; padding:.45rem .7rem; background:rgba(46,204,113,.07); border:1px solid rgba(46,204,113,.22); border-radius:8px; font-size:.84rem; line-height:1.6; color:var(--text); }
#page-lexique .terme-exemple em { font-style:normal; font-weight:600; color:var(--accent); }
#page-lexique .badge-df { display:inline-block; font-size:.68rem; font-weight:600; padding:.1rem .45rem; border-radius:10px; background:rgba(61,139,255,.12); border:1px solid rgba(61,139,255,.35); color:var(--blue); margin-left:.5rem; vertical-align:middle; }
#page-lexique .no-results { text-align:center; color:var(--muted); padding:2rem 0; display:none; }
#page-lexique .doc-footer { text-align:center; color:var(--muted); font-size:.78rem; margin-top:2rem; padding-top:1rem; border-top:1px solid var(--border); }
#page-lexique mark { background:rgba(46,204,113,.25); color:inherit; border-radius:3px; padding:0 2px; }

/* ══ Page barèmes (SPA) ══════════════════════════════════════════ */
#page-baremes { padding: 1rem 1rem 4rem; }
#page-baremes .bar-inner { max-width: 680px; margin: 0 auto; }
#page-baremes .bar-section { margin-bottom: 1.5rem; }
#page-baremes .bar-section-title { font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:.6rem; }
#page-baremes .bar-card { background:var(--s1); border:1px solid var(--border); border-radius:12px; overflow:hidden; margin-bottom:.75rem; }
#page-baremes .bar-card-head { padding:.6rem .9rem; font-weight:700; font-size:.88rem; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.5rem; }
#page-baremes .bar-card-body { padding:.75rem .9rem; font-size:.83rem; }
#page-baremes .bar-cols2 { display:flex; gap:1rem; flex-wrap:wrap; }
#page-baremes .bar-cols2 > * { flex:1; min-width:190px; }
#page-baremes .bar-label { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:.35rem; }
#page-baremes table { width:100%; border-collapse:collapse; font-size:.82rem; }
#page-baremes th { padding:.35rem .5rem; text-align:center; border-bottom:2px solid var(--border); color:var(--muted); font-weight:600; font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; }
#page-baremes th:first-child { text-align:left; }
#page-baremes td { padding:.28rem .5rem; border-bottom:1px solid var(--border); text-align:center; font-weight:700; }
#page-baremes td:first-child { text-align:left; font-weight:400; }
#page-baremes tr:last-child td { border-bottom:none; }
#page-baremes tr:nth-child(even) { background:var(--s2); }
#page-baremes .bar-note { font-size:.72rem; color:var(--muted); margin-top:.45rem; line-height:1.5; }
#page-baremes .bar-formula { background:var(--s2); border:1px solid var(--border); border-radius:8px; padding:.5rem .75rem; font-size:.78rem; color:var(--muted); margin-top:.6rem; line-height:1.6; }
#page-baremes .bar-formula code { color:var(--accent); }
#page-baremes .bar-pill { display:inline-flex; align-items:center; padding:.2rem .6rem; border-radius:20px; font-size:.72rem; font-weight:700; }
#page-baremes .bar-pill-blue   { background:rgba(61,139,255,.12); color:var(--blue);   border:1px solid rgba(61,139,255,.3); }
#page-baremes .bar-pill-orange { background:rgba(230,126,34,.15); color:var(--orange); border:1px solid rgba(230,126,34,.3); }
#page-baremes .bar-pill-green  { background:rgba(46,204,113,.12); color:var(--accent); border:1px solid rgba(46,204,113,.3); }
#page-baremes .bar-proj-head { padding:.55rem .9rem; font-weight:700; font-size:.88rem; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.5rem; }

/* ═══════════════════════════════════════════
   PAGE BARÈMES — header (symétrique lexique)
═══════════════════════════════════════════ */
#page-baremes .bar-doc-header {
  text-align: center; margin-bottom: 1.5rem; padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--border);
}
#page-baremes .bar-doc-title {
  font-family: 'Bebas Neue', sans-serif; font-size: 2rem; letter-spacing: .06em;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
#page-baremes .bar-doc-sub { font-size: .82rem; color: var(--muted); margin-top: .3rem; }

/* ═══════════════════════════════════════════
   OVERLAYS — structure (évite les inline styles)
═══════════════════════════════════════════ */
#loading      { flex-direction: column; gap: 1rem }
#acces-bloque { flex-direction: column; gap: 1.2rem; padding: 2rem; text-align: center }
#badge-zoom   { flex-direction: column; gap: 1rem; cursor: pointer }

#acces-bloque-titre {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: .05em; color: #fff;
}
#acces-bloque #msg-bloque { font-size: .95rem; color: rgba(255,255,255,.8); line-height: 1.6; max-width: 280px; }

#loading-msg {
  color: #fff; font-size: .88rem; text-align: center; line-height: 1.5; display: none;
}
#loading-retry {
  display: none; margin-top: .5rem; padding: .6rem 1.4rem;
  border: none; border-radius: 8px; background: #fff; color: #333;
  font-size: .95rem; font-weight: 600; cursor: pointer;
}

/* ═══════════════════════════════════════════
   POPUP ÉCART SÉQUENCE
═══════════════════════════════════════════ */
#ecart-popup-close {
  position: absolute; top: .75rem; right: .75rem;
  background: none; border: none; font-size: 1.4rem;
  color: var(--muted); cursor: pointer; line-height: 1;
}
#ecart-popup-seq {
  font-size: .85rem; color: var(--text); text-transform: uppercase;
  letter-spacing: .08em; font-weight: 700; margin-bottom: 1rem;
}
#ecart-popup-objectif { font-size: .9rem; color: var(--muted); margin-bottom: .4rem; }
#ecart-popup-reel     { font-size: .9rem; color: var(--text); font-weight: 700; margin-bottom: 1rem; }
#ecart-popup-pct      { font-family: 'Bebas Neue', sans-serif; font-size: 3.5rem; line-height: 1; }

/* ═══════════════════════════════════════════
   LOGIN — bas de page
═══════════════════════════════════════════ */
.login-wrap   { width: 100%; max-width: 400px; margin: auto; }
.login-footer {
  text-align: center; margin-top: 1.25rem;
  display: flex; justify-content: center; align-items: center; gap: 1.2rem;
}
.login-footer-btn {
  font-size: .82rem; color: var(--muted); background: none; border: none;
  cursor: pointer; font-family: 'DM Sans', sans-serif;
}
.login-theme-btn {
  border: none; background: none; cursor: pointer; font-size: 1.2rem; line-height: 1; padding: 0;
}

/* ═══════════════════════════════════════════
   TOPBAR — spans info (redondances inline)
═══════════════════════════════════════════ */
#tb-projet-label { font-size: .75rem; color: var(--muted); }
#tb-seance-label { color: var(--accent); }
#tb-prenom { text-transform: uppercase }

/* ═══════════════════════════════════════════
   PAGE BARÈMES — proj-head couleurs par projet
═══════════════════════════════════════════ */
#page-baremes .bar-proj-p1 { background: rgba(61,139,255,.08); border-bottom-color: rgba(61,139,255,.2) }
#page-baremes .bar-proj-p2 { background: rgba(230,126,34,.08); border-bottom-color: rgba(230,126,34,.2) }
#page-baremes .bar-proj-p3 { background: rgba(46,204,113,.08); border-bottom-color: rgba(46,204,113,.2) }
.bar-proj-p1-text { color: var(--blue) }
.bar-proj-p2-text { color: var(--orange) }
.bar-proj-p3-text { color: var(--accent) }

/* ═══════════════════════════════════════════
   BADGE ZOOM
═══════════════════════════════════════════ */
#badge-zoom-emoji { font-size: 7rem; line-height: 1 }
#badge-zoom-label {
  font-family: 'Bebas Neue', sans-serif; font-size: 2rem; letter-spacing: .08em; color: #fff;
}
#badge-zoom-hint  { font-size: .78rem; color: rgba(255,255,255,.45) }

/* ═══════════════════════════════════════════
   POPUP ÉCART — variantes modal + bouton
═══════════════════════════════════════════ */
.modal-center { text-align: center }
#ecart-popup-next { margin-top: 1.25rem }
#acces-bloque-icon { font-size: 2.5rem }

/* ═══════════════════════════════════════════
   LEXIQUE — barre de recherche
═══════════════════════════════════════════ */
#page-lexique .lex-search-wrap {
  position: relative; margin-bottom: 1.25rem;
}
#page-lexique .lex-search-icon {
  position: absolute; left: .7rem; top: 50%; transform: translateY(-50%);
  color: var(--muted); pointer-events: none;
}
#page-lexique #lex-search {
  width: 100%; background: var(--s1); border: 1px solid var(--border); border-radius: 10px;
  color: var(--text); font-family: 'DM Sans', sans-serif; font-size: .9rem;
  padding: .55rem .9rem .55rem 2.2rem; outline: none;
  transition: border-color .2s;
}
#page-lexique #lex-search:focus { border-color: var(--accent) }

/* ═══════════════════════════════════════════
   DEMI-FOND — composants spécifiques
═══════════════════════════════════════════ */

/* Override : le .cta-card hérité de CED était en vert — on passe au bleu DF */
.cta-card {
  background: linear-gradient(135deg, rgba(26,110,181,.12), rgba(26,110,181,.04));
  border: 1px solid rgba(26,110,181,.30);
}
.cta-card.cta-eval {
  background: linear-gradient(135deg, rgba(26,110,181,.18), rgba(26,110,181,.06));
  border-color: rgba(26,110,181,.45);
}

/* Hero d'accueil */
.hero-card {
  background: var(--s1); border: 1px solid var(--border); border-radius: 16px;
  padding: 1.1rem 1.25rem; margin-bottom: .75rem;
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
}
.hero-greeting { font-size: 1.05rem; font-weight: 600; }
.hero-vma { display: flex; align-items: baseline; gap: .3rem; }
.hero-vma-label { font-size: .7rem; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.hero-vma-val {
  font-family: 'Bebas Neue', sans-serif; font-size: 2.1rem; line-height: 1; color: var(--accent);
}
.hero-vma-unit { font-size: .75rem; color: var(--muted); }
.hero-vma-empty { font-size: .82rem; color: var(--muted); font-style: italic; }

/* Badge code ST */
.st-badge {
  display: inline-block; font-family: 'Bebas Neue', sans-serif; letter-spacing: .04em;
  background: var(--accent); color: #fff; border-radius: 7px;
  padding: .12rem .5rem; font-size: 1rem;
}

/* Carte séance du jour */
.seance-jour-card { cursor: pointer; transition: border-color .15s; }
.seance-jour-card:hover { border-color: var(--accent); }
.seance-jour-head { display: flex; align-items: center; gap: .55rem; }
.seance-jour-titre { font-weight: 700; font-size: 1.02rem; }
.st-soustitre { font-size: .85rem; color: var(--muted); margin-top: .15rem; }
.seance-jour-resume { font-size: .85rem; color: var(--muted); margin-top: .35rem; }
.seance-jour-link { margin-top: .6rem; font-size: .82rem; color: var(--accent); font-weight: 600; }

/* Petites cartes */
.card-mini-title { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin-bottom: .4rem; }
.last-seance { display: flex; justify-content: space-between; align-items: center; gap: .5rem; font-size: .9rem; }
.last-seance-date { color: var(--muted); font-size: .82rem; }
.info-card { color: var(--muted); font-size: .88rem; text-align: center; }

/* Footer login */

/* ═══════════════════════════════════════════
   DEMI-FOND — page séance (exercices)
═══════════════════════════════════════════ */
.exo-card { margin-bottom: .75rem; }
.exo-head { display: flex; flex-direction: column; gap: .15rem; margin-bottom: .5rem; }
.exo-title { font-weight: 700; font-size: 1rem; }
.exo-sub   { font-size: .78rem; color: var(--muted); }
.exo-cible { font-size: .85rem; margin-bottom: .5rem; padding: .3rem .5rem; background: var(--s2); border-radius: 7px; }
.exo-recup { font-size: .76rem; color: var(--muted); margin-top: .5rem; font-style: italic; }

.rep-row {
  display: flex; align-items: center; gap: .5rem;
  padding: .4rem 0; border-top: 1px solid var(--border);
}
.rep-num   { width: 2.4rem; font-weight: 700; font-size: .9rem; color: var(--accent); flex-shrink: 0; }
.rep-row .rep-temps {
  width: 4.8rem; flex-shrink: 0; text-align: center; font-size: 1rem; font-weight: 600;
  background: var(--s1); border: 1.5px solid var(--border); border-radius: 7px; padding: .3rem .2rem; color: var(--text);
}
.rep-row .rep-temps:focus { border-color: var(--accent); outline: none; }
.rep-check { flex: 1; min-width: 0; font-size: .8rem; font-weight: 700; text-align: right; }
.rep-check.ok { color: var(--green); }
.rep-check.ko { color: var(--red); }

.rep-row-toggle { flex-wrap: wrap; }
.rep-toggle {
  flex: 1; min-width: 7rem; border: 1.5px solid var(--border); background: var(--s1); color: var(--text);
  border-radius: 7px; padding: .35rem .5rem; font-size: .85rem; font-weight: 600; cursor: pointer;
}
.rep-toggle.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.rep-ress { display: flex; gap: .3rem; flex-shrink: 0; }
.rep-ress button {
  width: 2.1rem; border: 1.5px solid var(--border); background: var(--s1); color: var(--muted);
  border-radius: 7px; padding: .35rem 0; font-size: .8rem; font-weight: 700; cursor: pointer;
}
/* Code couleur ressenti repris de la muscu */
.rep-ress button.sel[data-r="F"]  { background: #2980b9; border-color: #2980b9; color: #fff; }
.rep-ress button.sel[data-r="D"]  { background: #27ae60; border-color: #27ae60; color: #fff; }
.rep-ress button.sel[data-r="TD"] { background: #f39c12; border-color: #f39c12; color: #fff; }
.rep-ress button[disabled] { opacity: .3; cursor: default; }
.rep-ress button[disabled].sel { opacity: 1; }

/* Bouton « valider ce temps » par course (séance) */
.rep-save {
  flex-shrink: 0; width: 2.1rem; height: 2rem; border: 1.5px solid var(--border);
  background: var(--s1); color: var(--text); border-radius: 7px; font-size: .9rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.rep-save:hover { border-color: var(--accent); }
.rep-save.saved { background: var(--green); border-color: var(--green); color: #fff; }

/* ═══════════════════════════════════════════
   DEMI-FOND — séances : remarque, variantes, annonce, stratégies
═══════════════════════════════════════════ */
.st-remarque { font-size: .8rem; color: var(--muted); font-style: italic; margin-top: .3rem; }

/* Sélecteur de variante (ST5/ST6) */
.variante-btns { display: flex; flex-direction: column; gap: .4rem; }
.variante-btn {
  width: 100%; text-align: left; border: 1.5px solid var(--border); background: var(--s1); color: var(--text);
  border-radius: 9px; padding: .55rem .7rem; font-size: .88rem; font-weight: 600; cursor: pointer;
}
.variante-btn.sel { background: var(--accent); border-color: var(--accent); color: #fff; }

/* Annonce du temps C1 (ST7) */
.annonce-row { display: flex; align-items: center; gap: .5rem; }
.annonce-label { font-size: .9rem; font-weight: 600; }
.annonce-row .annonce-input {
  width: 5rem; flex-shrink: 0; text-align: center; font-size: 1rem; font-weight: 600;
  background: var(--s1); border: 1.5px solid var(--border); border-radius: 7px; padding: .3rem .2rem; color: var(--text);
}
.annonce-row .annonce-input:focus { border-color: var(--accent); outline: none; }
.annonce-hint { font-size: .76rem; color: var(--muted); margin-top: .4rem; }

/* Grille de stratégies (ST8) */
.strat-grid { display: flex; flex-direction: column; gap: .45rem; }
.strat-row  { display: flex; justify-content: center; gap: .45rem; }
.strat-item {
  flex: 0 0 auto; width: 60px;
  border: 2px solid var(--border); background: var(--s1); border-radius: 9px;
  padding: .25rem; cursor: pointer; line-height: 0;
}
.strat-item svg { width: 100%; height: auto; display: block; color: #16a34a; }
.strat-item.sel { border-color: var(--accent); background: rgba(26,110,181,.08); }

/* Numéro de variante (sélecteur + carte d'exercice) */
.var-num {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.5em; height: 1.5em; padding: 0 .25em; margin-right: .15em;
  background: var(--accent); color: #fff; border-radius: 50%;
  font-weight: 800; font-size: .82em; line-height: 1; flex-shrink: 0;
}
.variante-btn.sel .var-num { background: #fff; color: var(--accent); }

/* Bouton « Valider ma séance » désactivé tant que tout n'est pas renseigné */
#btn-valider-seance:disabled { opacity: .4; cursor: not-allowed; }

/* Course verrouillée tant que la précédente (ou l'annonce ST7) n'est pas validée */
.rep-row.rep-locked .rep-temps,
.rep-row.rep-locked .rep-save { opacity: .4; cursor: not-allowed; }
.rep-row.rep-locked .rep-num { opacity: .5; }

/* Stratégie : révision, repli, bilan */
.strat-item.old { border-color: #e74c3c; box-shadow: 0 0 0 2px rgba(231,76,60,.45); }
.card-locked { opacity: .6; }
.strat-chosen { display: flex; flex-direction: column; align-items: center; gap: .35rem; }
.strat-chosen svg { width: 96px; height: auto; color: #16a34a; }
.strat-chosen .strat-nom { font-size: .9rem; color: var(--text); font-weight: 700; }
.strat-bilan { display: flex; gap: 1rem; justify-content: center; }
.strat-bilan-col { display: flex; flex-direction: column; align-items: center; gap: .25rem; flex: 1; }
.strat-bilan-col svg { width: 84px; height: auto; color: #16a34a; }
.strat-bilan-lbl { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.strat-bilan-col .strat-nom { font-size: .8rem; text-align: center; }
.strat-chain { display: flex; align-items: flex-start; justify-content: center; flex-wrap: wrap; gap: .3rem; }
.strat-chain-item { display: flex; flex-direction: column; align-items: center; gap: .2rem; width: 82px; }
.strat-chain-item svg { width: 54px; height: 54px; color: #16a34a; }
.strat-chain-lbl { font-size: .7rem; font-weight: 700; color: var(--muted); }
.strat-chain-nom { font-size: .7rem; text-align: center; line-height: 1.1; }
.strat-chain-arrow { align-self: center; color: var(--muted); font-size: 1.3rem; font-weight: 700; }
.repere-c1 .repere-row { display: flex; justify-content: space-between; align-items: center; padding: .3rem 0; font-size: .95rem; }
.repere-tag { font-weight: 700; font-size: .8rem; padding: .18rem .55rem; border-radius: 7px; }
.repere-tag.same { background: rgba(41,128,185,.12); color: #1a6eb5; }
.repere-tag.fast { background: rgba(39,174,96,.14); color: #1e8e4e; }
.repere-tag.slow { background: rgba(243,156,18,.16); color: #b9770e; }
.strat-respect { text-align: center; font-weight: 800; margin-top: .8rem; padding: .5rem; border-radius: 9px; }
.strat-respect.ok { background: rgba(39,174,96,.15); color: var(--green); }
.strat-respect.ko { background: rgba(231,76,60,.15); color: var(--red); }

/* Temps validé (non modifiable) */
.rep-row.rep-done .rep-temps { border-color: var(--green); color: var(--text); opacity: 1; }
.strat-penalite { text-align: center; font-size: .82rem; font-weight: 700; color: var(--red); margin-top: .5rem; }

/* Séance / évaluation validée (confirmation, bouton retiré) */
.seance-validee { color: var(--green); font-weight: 800; border: 1px solid rgba(39,174,96,.4); }

/* ═══════════════════════════════════════════
   DEMI-FOND — onglet Bilan (historique du cycle)
═══════════════════════════════════════════ */
.bil-item-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.bil-item-titre { font-weight: 700; font-size: 1rem; }
.bil-item-sub { font-size: .82rem; color: var(--muted); margin-top: .25rem; }
.bil-click { cursor: pointer; transition: border-color .15s; }
.bil-click:hover { border-color: var(--accent); }
.bil-badge { font-size: .72rem; font-weight: 700; padding: .12rem .5rem; border-radius: 20px; white-space: nowrap; }
.bil-badge.ok  { background: rgba(39,174,96,.15); color: var(--green); }
.bil-badge.enc { background: rgba(26,110,181,.15); color: var(--accent); }
.bil-badge.av  { background: var(--s2); color: var(--muted); }
.bil-rep { display: flex; align-items: center; gap: .6rem; padding: .3rem 0; border-top: 1px solid var(--border); font-size: .9rem; }
.bil-rep .rep-num { width: 2.4rem; }
.bil-ress { margin-left: auto; font-weight: 700; padding: .1rem .5rem; border-radius: 6px; color: #fff; font-size: .78rem; }
.bil-ress.r-F  { background: #2980b9; }
.bil-ress.r-D  { background: #27ae60; }
.bil-ress.r-TD { background: #f39c12; }

/* Toggle figé après validation de la séance */
.rep-toggle:disabled { opacity: .5; cursor: default; }
.rep-toggle.on:disabled { opacity: 1; }

/* Bouton de validation de temps (page chrono éval) : rejeté à droite, large, sans disquette */
.course-valider {
  margin-left: auto; flex-shrink: 0; min-width: 5.5rem;
  border: 1.5px solid var(--accent); background: var(--accent); color: #fff;
  border-radius: 9px; padding: .55rem .8rem; font-size: .9rem; font-weight: 700; cursor: pointer;
}
.course-valider.saved { background: var(--green); border-color: var(--green); }
.course-valider:disabled { opacity: .4; cursor: not-allowed; }
/* Petit bouton "OK" des courses de séance un poil plus large */
.rep-save { min-width: 2.6rem; width: auto; }

/* Minuteur de récupération (page éval) */
.recup-timer {
  font-family: 'Bebas Neue', sans-serif; font-size: 3.4rem; line-height: 1.1;
  color: var(--red); letter-spacing: .03em; margin: .2rem 0;
}

.eval-course-num {
  font-family: 'Bebas Neue', sans-serif; font-size: 2.4rem; line-height: 1.1;
  color: var(--accent); letter-spacing: .03em; margin: .1rem 0 .3rem;
}
.info-label { font-weight: 700; color: var(--accent); margin-bottom: .25rem }