/* Smart Stopwatch — chronometre de course. Variables de app.css uniquement. */

.race-columns{align-items:start}
.race-start-list .section-title{flex-wrap:wrap}
.race-undo{min-height:34px;padding:6px 12px;font-size:12px}

.race-runners,.race-ranking{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.race-runner{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;align-items:center;gap:10px;
  padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.race-runner.is-finished{background:var(--greenSoft);border-color:transparent}

.race-bib{position:relative;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  background:var(--purpleSoft);color:var(--purple);font-weight:800;font-size:16px;font-variant-numeric:tabular-nums}
.race-rank{position:absolute;inset-inline-end:-4px;bottom:-4px;min-width:20px;padding:1px 5px;border-radius:999px;
  background:var(--green);color:var(--onVivid);font-size:11px;font-weight:800;line-height:1.5;text-align:center}

.race-runner-body{min-width:0;display:grid;gap:2px}
.race-name{width:100%;min-width:0;border:1px solid transparent;border-radius:8px;background:transparent;
  padding:6px 8px;font:inherit;font-size:14px;font-weight:700;color:var(--text)}
.race-name:hover{border-color:var(--line)}
.race-name:focus{outline:none;border-color:var(--purple);background:var(--surface)}
.race-runner-time{padding:0 8px;font-size:12.5px;font-weight:800;color:var(--okText);font-variant-numeric:tabular-nums;direction:ltr;text-align:start}

/* Cible tactile pleine : on appuie dessus dans l'urgence. */
.race-finish-btn{min-width:96px;min-height:44px}
.race-finish-btn:disabled{opacity:.45;cursor:not-allowed}
.race-done{width:32px;text-align:center;font-size:20px;font-weight:800;color:var(--green)}
.race-remove{border:0;background:transparent;color:var(--muted);font-size:14px;padding:6px;border-radius:8px;cursor:pointer}
.race-remove:hover{background:var(--surface3);color:var(--red)}
.race-add{width:100%;margin-top:12px}

.race-rank-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:4px 10px;
  padding:10px 4px;border-bottom:1px solid var(--line)}
.race-rank-row:last-child{border-bottom:0}
.race-pos{font-size:18px;font-weight:800;text-align:center;color:var(--muted)}
.race-who{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.race-time{font-weight:800;font-variant-numeric:tabular-nums;direction:ltr}
.race-gap{grid-column:2/-1;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}

.race-finish{margin-top:16px}
.race-finish[hidden]{display:none}
.race-finish-row{display:flex;flex-wrap:wrap;gap:10px}
.race-finish-row .input{flex:1 1 240px}
.race-feedback{min-height:18px;margin:10px 0 0;font-size:12.5px}
.race-feedback a{color:var(--purple);font-weight:700}

@media (max-width:600px){
  .race-runner{grid-template-columns:38px minmax(0,1fr) auto;gap:8px}
  .race-bib{width:38px;height:38px;font-size:14px}
  .race-remove{grid-column:3;grid-row:1;justify-self:end;align-self:start}
  .race-finish-btn,.race-done{grid-column:2/-1}
  .race-finish-btn{width:100%}
  .race-finish-row .btn{flex:1 1 100%}
}
