/* EvoluCote, thème Paddock 2.0 (jetons du thème : --carte, --or, --pelouse…) */
.ec { display: grid; gap: 14px; margin: 0 0 1.5em; }
.ec-choix { display: flex; flex-wrap: wrap; gap: 10px 16px; }
.ec-choix label { display: grid; gap: 4px; font: 600 12px var(--texte); letter-spacing: .1em; text-transform: uppercase; color: var(--encre-3); }
.ec-choix select { min-height: 44px; min-width: 12em; max-width: 100%; letter-spacing: 0; text-transform: none; }
.ec-attente { margin: 0; color: var(--encre-3); }
.ec-erreur { margin: 0; color: var(--perd); }
.ec-graphe { display: grid; gap: 10px; }
.ec-cadre { position: relative; }
.ec-svg { display: block; width: 100%; height: auto; background: var(--carte-2); border: 1px solid var(--trait); border-radius: 4px; touch-action: pan-y; cursor: crosshair; user-select: none; }
.ec-grille { stroke: var(--trait); stroke-width: 1; }
.ec-axe { fill: var(--encre-3); font: 12px var(--texte); }
.ec-courbe { fill: none; stroke-width: 2; }
.ec-repere { stroke: var(--encre-3); stroke-dasharray: 3 3; }
.ec-plage { fill: rgba(242, 185, 59, .18); stroke: var(--or); }
.ec-bulle { position: absolute; z-index: 2; pointer-events: none; display: grid; gap: 2px; padding: 8px 10px; border-radius: 4px; background: var(--fond); border: 1px solid var(--or); font-size: 13px; white-space: nowrap; box-shadow: 0 6px 18px rgba(0, 0, 0, .4); }
.ec-bulle[hidden] { display: none; }
.ec-bulle div { display: flex; align-items: center; gap: 6px; }
.ec-bulle i, .ec-chevaux i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.ec-outils { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.ec-outils [hidden] { display: none; }
.ec-aide { font-size: 13px; color: var(--encre-3); }
.ec-tous { display: flex; gap: 8px; }
.ec-tous .bouton, .ec-outils .bouton { min-height: 36px; padding: 4px 14px; }
.ec-chevaux { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 4px 12px; }
.ec-chevaux label { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--encre-2); cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ec-marques circle { stroke: var(--fond); stroke-width: 2; }
.ec-svg.focus g[data-n] { opacity: .12; }
.ec-svg.focus g[data-n].actif { opacity: 1; }
.ec-svg.focus g.actif .ec-courbe { stroke-width: 3.5; }
.ec-bulle.deux-col { grid-template-columns: auto auto; column-gap: 16px; }
.ec-bulle.deux-col strong { grid-column: 1 / -1; }
.ec-echelle { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--encre-2); cursor: pointer; }
