/* Page live (v1.79). Couleurs de la charte (style.css) ; couloirs et points aux couleurs des catégories Zwift. */
.lv { --lv-ink: #0f172a; --lv-rule: #334155; --lv-muted: #94a3b8; --lv-text: #e2e8f0; color: var(--lv-text); }
.lv-board { background: var(--lv-ink); border: 1px solid var(--lv-rule); border-radius: 10px; padding: 18px 20px 14px; }
.lv-board-top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; }
.lv-title { margin: 0; font-family: 'Barlow Condensed', sans-serif; font-style: italic; font-weight: 800; font-size: 34px; line-height: 1; }
.lv-status { margin: 0; font-size: 14px; color: var(--lv-muted); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.lv-onair { display: inline-flex; align-items: center; gap: 7px; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 17px;
            letter-spacing: .02em; color: #fff; background: var(--alert-red); padding: 2px 10px 2px 8px; border-radius: 4px; }
.lv-onair::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #fff; animation: lv-pulse 1.6s ease-in-out infinite; }
.lv-onair.is-replay { background: var(--brand-orange); color: #1e293b; }
.lv-onair.is-replay::before { background: #1e293b; }
@keyframes lv-pulse { 50% { opacity: .25; } }
.lv-line { margin: 8px 0 12px; font-size: 16px; }
.lv-line b { font-family: 'Barlow Condensed', sans-serif; font-style: italic; font-size: 22px; color: var(--brand-pink-text); }
.lv-line a { color: var(--lv-muted); font-size: 14px; margin-left: 10px; }
.lv-note { margin: 10px 0 0; font-size: 13px; color: var(--lv-muted); }
.lv-note.is-warn { color: var(--brand-orange); }

/* Carte : profil au rendu des étapes Winter (assets/winter.css, .wp-*) + couloirs par catégorie (live.js).
   Le profil et les couloirs partagent la même échelle horizontale : marge gauche 34 px (lettres A–D), droite 10 px. */
.lv-map { position: relative; }
.lv-map .wp-range { margin: 0 10px 2px 0; text-align: right; font-size: 12px; color: var(--lv-muted); font-variant-numeric: tabular-nums; }
.lv-map .wp-plot { position: relative; height: 150px; margin: 0 10px 0 34px; }
.lv-map .wp-plot svg { display: block; width: 100%; height: 100%; overflow: visible; }
.lv-map .wp-area { fill: var(--brand-pink); opacity: .16; }
.lv-map .wp-line { fill: none; stroke: var(--brand-pink); stroke-width: 2.4; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.lv-map .wp-seg-area { opacity: .38; } .lv-map .wp-seg-area.is-kom { fill: var(--alert-red); } .lv-map .wp-seg-area.is-sprint { fill: var(--cat-b); }
.lv-map .wp-seg { fill: none; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.lv-map .wp-seg.is-kom { stroke: var(--alert-red); } .lv-map .wp-seg.is-sprint { stroke: var(--cat-b); }
.lv-map .wp-lap { stroke: rgba(226, 232, 240, .35); stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.lv-map .wp-laplabel { position: absolute; top: 0; transform: translateX(4px); font-size: 11px; color: var(--lv-muted); white-space: nowrap; }
.lv-map .wp-tag { position: absolute; transform: translate(-50%, -100%); padding: 1px 6px; border-radius: 4px; font-size: 11px; font-weight: 700;
                  line-height: 1.35; color: #fff; white-space: nowrap; z-index: 1; }
.lv-map .wp-tag.is-kom { background: var(--alert-red); } .lv-map .wp-tag.is-sprint { background: #23964a; }
.lv-map .wp-ticks { position: relative; height: 20px; margin: 4px 10px 0 34px; border-top: 1px solid var(--lv-rule); font-size: 11px; color: var(--lv-muted); font-variant-numeric: tabular-nums; }
.lv-map .wp-ticks span { position: absolute; top: 3px; transform: translateX(-50%); white-space: nowrap; }
.lv-map .wp-ticks span:first-child { transform: none; }
.lv-map .wp-ticks span.is-end { transform: translateX(-100%); color: #fff; font-weight: 600; }
.lv-pin { position: absolute; z-index: 2; transform: translate(-50%, -50%); width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--lv-ink);
          font: normal 700 11px/14px -apple-system, Segoe UI, Roboto, Arial, sans-serif; text-align: center; color: #1e293b; transition: left 1.2s ease-out, top 1.2s ease-out; }
.lv-pin.cat-A { background: var(--cat-a); color: #fff; } .lv-pin.cat-B { background: var(--cat-b); } .lv-pin.cat-C { background: var(--cat-c); } .lv-pin.cat-D { background: var(--cat-d); }
.lv-lanes { display: block; width: 100%; height: auto; overflow: visible; margin-top: 4px; }
.lv-lanes .lv-lane { stroke: var(--lv-rule); stroke-width: 1; }
.lv-lanes .lv-lane-lab { font: 700 13px 'Barlow Condensed', sans-serif; }
.lv-dot { transition: transform 1.2s ease-out, opacity .3s; cursor: pointer; }
.lv-dot circle { stroke: var(--lv-ink); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.lv-dot.is-dim { opacity: .18; }
.lv-dot.is-hit circle { stroke: #fff; stroke-width: 2.4; }
.lv-dot.cat-A circle { fill: var(--cat-a); } .lv-dot.cat-B circle { fill: var(--cat-b); }
.lv-dot.cat-C circle { fill: var(--cat-c); } .lv-dot.cat-D circle { fill: var(--cat-d); }
.lv-lead { font: 700 12px 'Barlow Condensed', sans-serif; fill: var(--lv-text); paint-order: stroke; stroke: var(--lv-ink); stroke-width: 3px; }
.lv-tip { position: absolute; z-index: 3; pointer-events: none; background: #1e293b; border: 1px solid var(--lv-rule); border-radius: 6px;
          padding: 6px 9px; font-size: 13px; white-space: nowrap; transform: translate(-50%, calc(-100% - 10px)); box-shadow: 0 6px 18px rgba(0,0,0,.4); }
.lv-tip small { display: block; color: var(--lv-muted); }

/* Compte à rebours hors course */
.lv-next { display: grid; grid-template-columns: auto 1fr; gap: 6px 24px; align-items: center; padding: 6px 0 4px; }
.lv-clock { font-family: 'Barlow Condensed', sans-serif; font-style: italic; font-weight: 800; font-size: 56px; line-height: 1; color: #fff; font-variant-numeric: tabular-nums; }
.lv-clock small { display: block; font-size: 14px; font-style: normal; font-weight: 700; color: var(--lv-muted); margin-bottom: 4px; }
.lv-pens { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; padding: 0; list-style: none; font-size: 15px; }

/* Onglets, filtres, tableaux */
.lv-panel { margin-top: 18px; }
.lv-controls { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 10px; }
.lv-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--lv-rule); overflow-x: auto; scrollbar-width: none; max-width: 100%; }
.lv-tab { all: unset; cursor: pointer; padding: 8px 14px; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 18px; color: var(--lv-muted);
          border-bottom: 3px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.lv-tab[aria-selected="true"] { color: #fff; border-bottom-color: var(--brand-pink); }
.lv-tab:focus-visible, .lv-cat:focus-visible { outline: 2px solid var(--brand-orange); outline-offset: 2px; }
.lv-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.lv-cats { display: flex; gap: 4px; }
.lv-cat { all: unset; cursor: pointer; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--lv-rule); font-size: 13px; font-weight: 700; line-height: 1.4; }
.lv-cat.is-on { border-color: var(--brand-pink); background: rgba(224, 24, 154, .18); }
.lv-search { width: 200px; margin: 0; padding: 6px 10px; }
.lv-view h3 { margin: 18px 0 6px; font-family: 'Barlow Condensed', sans-serif; font-style: italic; font-size: 22px; display: flex; align-items: center; gap: 8px; color: #fff; }
.lv-view h3 small { font: 13px -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: var(--lv-muted); }
.lv-view h3:first-child { margin-top: 4px; }
.lv-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: 0 22px; }
.lv-grid > * { min-width: 0; }
.lv-grid-wide { grid-template-columns: repeat(auto-fit, minmax(460px, 1fr)); }
.lv-table { margin-top: 0; font-size: 14px; font-variant-numeric: tabular-nums; }
.lv-table th { font-size: 12px; color: var(--lv-muted); font-weight: 600; padding: 6px; white-space: nowrap; }
.lv-table td { padding: 6px; }
.lv-table td.n, .lv-table th.n { text-align: right; white-space: nowrap; }
.lv-table td.pos { width: 28px; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 16px; }
.lv-table tr.p1 td.pos { color: #F7C531; } .lv-table tr.p2 td.pos { color: #cbd5e1; } .lv-table tr.p3 td.pos { color: #d08b4c; }
.lv-table a { color: var(--lv-text); text-decoration: none; }
.lv-table a:hover { color: var(--brand-pink-text); text-decoration: underline; }
.lv-table .team { display: block; font-size: 12px; color: var(--lv-muted); }
.lv-table tr.is-hit td { background: rgba(240, 162, 2, .10); }
.lv-tag { display: inline-block; font-size: 11px; padding: 0 6px; border-radius: 999px; border: 1px solid var(--lv-rule); color: var(--lv-muted); margin-left: 4px; vertical-align: 1px; }
.lv-tag.live { border-color: var(--alert-red); color: #fca5a5; }
.lv-up { color: var(--cat-b); } .lv-down { color: #f87171; } .lv-same { color: var(--lv-muted); }
.lv-empty { color: var(--lv-muted); font-style: italic; font-size: 14px; }
.lv-foot { font-size: 13px; color: var(--lv-muted); margin-top: 16px; }

@media (max-width: 640px) {
    .lv-map .wp-plot { height: 120px; }
    .lv-map .wp-tag { font-size: 9.5px; padding: 1px 4px; }
    .lv-board { padding: 14px 12px 12px; }
    .lv-title { font-size: 28px; }
    .lv-clock { font-size: 44px; }
    .lv-next { grid-template-columns: 1fr; }
    .lv-search { width: 100%; }
    .lv-filters { width: 100%; }
    .lv-grid, .lv-grid-wide { grid-template-columns: 1fr; }
    .lv-table .col-opt { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .lv-dot, .lv-pin { transition: none; }
    .lv-onair::before { animation: none; }
}
.lv-view h3 .cat-badge { font-style: normal; font-family: -apple-system, Segoe UI, Roboto, Arial, sans-serif; }

/* Revoir une étape (v1.82) : lecteur et liste des étapes à revoir */
.lv-player { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 12px; padding: 8px 10px; border: 1px solid var(--lv-rule); border-radius: 8px; }
.lv-play { all: unset; cursor: pointer; flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--brand-pink-fill); color: #fff;
           display: grid; place-items: center; font-size: 16px; }
.lv-play:focus-visible, .lv-speed:focus-visible { outline: 2px solid var(--brand-orange); outline-offset: 2px; }
.lv-seek { flex: 1; min-width: 160px; margin: 0; padding: 0; accent-color: var(--brand-pink); background: transparent; border: 0; }
.lv-time { font-variant-numeric: tabular-nums; font-size: 14px; color: var(--lv-muted); white-space: nowrap; }
.lv-speeds { display: flex; gap: 4px; }
.lv-speed { all: unset; cursor: pointer; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--lv-rule); font-size: 13px; font-weight: 700; }
.lv-speed.is-on { border-color: var(--brand-pink); background: rgba(224, 24, 154, .18); }
.lv.is-replay .lv-dot, .lv.is-replay .lv-pin { transition: none; }
.lv-back { color: var(--lv-muted); }
.lv-replays { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--lv-rule); }
.lv-replays-title { margin: 0 0 10px; font-family: 'Barlow Condensed', sans-serif; font-style: italic; font-size: 22px; }
.lv-replay-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; }
.lv-replay { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--lv-rule); border-radius: 8px; color: var(--lv-text); text-decoration: none; }
.lv-replay:hover { border-color: var(--brand-pink); }
.lv-replay b { display: block; font-size: 15px; }
.lv-replay small { display: block; color: var(--lv-muted); font-size: 12px; }
.lv-replay-play { flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--brand-pink-fill); color: #fff; display: grid; place-items: center; font-size: 12px; }
@media (max-width: 640px) { .lv-time { order: 3; } .lv-speeds { order: 4; margin-left: auto; } }
.lv-player[hidden], .lv-replays[hidden], .lv-tab[hidden] { display: none; }
.lv-table td.lv-ptgap { color: var(--lv-muted); font-size: 13px; }