/* Réseau ferroviaire (dynamique) — styles propres au jeu.
   Réutilise les variables d'identité (css/identite.css, chargée avant).
   Style éditorial : papier froid, marine, or, angles nets, Cormorant + Montserrat. */

main { width: 100%; max-width: var(--largeur); margin: 0 auto; padding: 1rem clamp(1.2rem, 4vw, 3rem) 1rem; }

/* Titre : variante « dynamique » */
.oa-variante {
  display: inline-block; font-style: italic; color: var(--gold);
  font-size: 0.5em; vertical-align: middle; letter-spacing: 0.02em;
}
.oa-liens-variantes { display: flex; gap: 0.6rem; justify-content: center; flex-wrap: wrap; margin-top: 0.3rem; }
.oa-liens-variantes a.oa-chip { text-decoration: none; }

/* ── Barre du temps ─────────────────────────────────────────────────────── */
.temps {
  display: flex; align-items: center; gap: clamp(0.8rem, 3vw, 2rem);
  padding: 0.9rem 1.2rem; margin: 0.6rem 0 1rem; flex-wrap: wrap;
  border-color: rgba(184, 154, 90, 0.5);
}
.temps-annee { display: flex; flex-direction: column; gap: 0.1rem; min-width: 120px; }
.temps-lbl { font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.22em; color: var(--gold); }
.temps-val { font-family: var(--serif); font-size: 2.6rem; font-weight: 400; color: var(--brand); line-height: 1; font-variant-numeric: tabular-nums; }
.temps-ere { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.16em; color: var(--muted); }
.temps-ere.ere-tgv { color: var(--gold); font-weight: 500; }
.temps-frise { flex: 1; min-width: 180px; }
.frise-piste { position: relative; height: 8px; background: var(--paper-hover); border-radius: 4px; overflow: hidden; }
.frise-remplie { position: absolute; left: 0; top: 0; height: 100%; width: 0; background: var(--gold); transition: width .3s ease; }
.frise-lgv { position: absolute; top: -3px; width: 2px; height: 14px; background: var(--brand); }
.frise-bornes { display: flex; justify-content: space-between; font-size: 0.62rem; color: var(--muted); margin-top: 0.25rem; position: relative; }
.frise-1981 { position: absolute; left: 40.8%; transform: translateX(-50%); color: var(--brand); }
.temps-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-annee {
  background: var(--gold); border: 1px solid var(--gold); color: var(--ink);
  padding: 0.7rem 1.4rem; cursor: pointer; font-family: var(--sans); font-weight: 500;
  font-size: 0.78rem; letter-spacing: 0.06em; transition: background .2s, color .2s, border-color .2s;
}
.btn-annee:hover:not(:disabled) { background: var(--gold-light); border-color: var(--gold-light); }
.btn-annee:disabled { opacity: 0.5; cursor: default; background: transparent; color: var(--muted); }
.btn-annee5 {
  background: transparent; border: 1px solid var(--line); color: var(--ink);
  padding: 0.7rem 0.9rem; cursor: pointer; font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.04em;
}
.btn-annee5:hover:not(:disabled) { border-color: var(--gold); color: var(--gold); }
.btn-annee5:disabled { opacity: 0.4; cursor: default; }

/* ── Tableau de bord ────────────────────────────────────────────────────── */
.tableau {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px;
  margin: 0 0 1rem;
}
.ind { padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: 0.3rem; min-width: 0; }
.ind-titre { font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.2em; color: var(--gold); }
.ind-grand { font-family: var(--serif); font-size: 2.2rem; font-weight: 400; color: var(--brand); line-height: 1; font-variant-numeric: tabular-nums; }
.ind-grand.invalide { color: var(--alerte); }
.ind-moyen { font-family: var(--serif); font-size: 1.55rem; font-weight: 400; color: var(--brand); line-height: 1.1; font-variant-numeric: tabular-nums; }
.ind-moyen.invalide { color: var(--alerte); }
.ind-note { font-size: 0.7rem; color: var(--muted); letter-spacing: 0.02em; }
.ind-note.alerte { color: var(--alerte); font-weight: 500; }
.ind-tresor .ind-grand { color: var(--brand); }
.ind-net .ind-moyen { color: var(--ok); }
.ind-net .ind-moyen.invalide { color: var(--alerte); }

/* ── Tarifs ─────────────────────────────────────────────────────────────── */
.tarifs { padding: 0.9rem 1.2rem 1.1rem; margin: 0 0 1rem; }
.tarifs-tete { display: flex; align-items: baseline; gap: 0.8rem; flex-wrap: wrap; margin-bottom: 0.6rem; }
.tarifs-hint { font-size: 0.7rem; color: var(--muted); }
.tarifs-grille { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.tarif-bloc { display: flex; flex-direction: column; gap: 0.35rem; }
.tarif-tete { display: flex; justify-content: space-between; align-items: baseline; }
.tarif-lbl { font-size: 0.76rem; color: var(--ink); letter-spacing: 0.02em; display: inline-flex; align-items: center; gap: 0.4rem; }
.tarif-lbl::before { content: ""; width: 16px; height: 3px; display: inline-block; }
.tl-standard::before { background: var(--brand); }
.tl-lgv::before { background: var(--gold); }
.tarif-tete b { font-family: var(--serif); font-size: 1.1rem; color: var(--brand); font-weight: 400; font-variant-numeric: tabular-nums; }
.tarif-bloc input[type="range"] { width: 100%; accent-color: var(--gold); cursor: pointer; }

/* ── Barre d'outils ─────────────────────────────────────────────────────── */
.outils { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.6rem; align-items: center; margin-bottom: 0.5rem; }
.groupe { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.groupe-lbl { color: var(--muted); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; }
.segmente { display: inline-flex; border: 1px solid var(--line); background: transparent; }
.seg { border: none; background: transparent; color: var(--ink); padding: 0.42rem 1rem; cursor: pointer; font-size: 0.72rem; font-family: var(--sans); letter-spacing: 0.1em; text-transform: uppercase; transition: background .2s, color .2s; }
.seg + .seg { border-left: 1px solid var(--line); }
.seg.actif { background: var(--gold); color: var(--ink); font-weight: 500; }
.seg:disabled { opacity: 0.4; cursor: not-allowed; }
.btn-outil { background: transparent; border: 1px solid var(--line); color: var(--ink); padding: 0.42rem 0.9rem; cursor: pointer; font-size: 0.74rem; font-family: var(--sans); letter-spacing: 0.04em; transition: border-color .2s, color .2s, background .2s; }
.btn-outil:hover:not(:disabled) { border-color: var(--gold); color: var(--gold); }
.btn-outil.actif { border-color: var(--gold); background: var(--paper-dark); color: var(--brand); }
.btn-outil:disabled { opacity: 0.4; cursor: not-allowed; }

.astuce { color: var(--muted); font-size: 0.8rem; margin: 0.2rem 0 0.5rem; min-height: 1.2rem; letter-spacing: 0.02em; }
.astuce.flash { color: var(--gold); font-weight: 500; }

/* ── Carte ──────────────────────────────────────────────────────────────── */
.carte-zone { background: var(--paper); padding: 0.5rem; overflow: hidden; position: relative; }
#carte { width: 100%; height: auto; display: block; touch-action: none; cursor: grab; }
#carte:active { cursor: grabbing; }
.zoom-ctrl { position: absolute; top: 0.7rem; right: 0.7rem; display: flex; flex-direction: column; gap: 4px; z-index: 5; }
.zoom-ctrl button { width: 30px; height: 30px; border: 1px solid var(--line); background: var(--paper); color: var(--brand); font-size: 1.05rem; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.zoom-ctrl button:hover { border-color: var(--gold); color: var(--gold); }

/* Menu Options */
.options-wrap { position: relative; }
#btn-options.actif { border-color: var(--gold); color: var(--gold); }
.menu-options { position: absolute; top: calc(100% + 6px); right: 0; z-index: 20; min-width: 250px; background: var(--paper); border: 1px solid var(--line); box-shadow: 0 14px 34px rgba(26, 24, 20, 0.12); padding: 0.6rem 0.7rem; display: flex; flex-direction: column; gap: 0.5rem; }
.menu-options[hidden] { display: none; }
.opt-ligne { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8rem; color: var(--ink); letter-spacing: 0.02em; cursor: pointer; }
.opt-ligne input { accent-color: var(--gold); cursor: pointer; }
.opt-sep { border: 0; border-top: 1px solid var(--line); margin: 0.15rem 0; width: 100%; }
.opt-btn { text-align: left; background: transparent; border: none; color: var(--ink); font-family: var(--sans); font-size: 0.8rem; padding: 0.3rem 0.1rem; cursor: pointer; letter-spacing: 0.02em; }
.opt-btn:hover { color: var(--gold); }

#carte.noms-visibles .ville-label { opacity: 1; }
.frontiere { fill: rgba(29, 58, 95, 0.05); stroke: rgba(184, 154, 90, 0.4); stroke-width: 1.1; stroke-linejoin: round; }

/* Relief */
.zone-relief { pointer-events: none; stroke-linejoin: round; }
.zone-faible { fill: rgba(180, 130, 70, 0.12); stroke: rgba(180, 130, 70, 0.45); stroke-width: 0.9; stroke-dasharray: 3 2; }
.zone-fort   { fill: rgba(150, 60, 45, 0.17);  stroke: rgba(150, 60, 45, 0.55);  stroke-width: 1.0; stroke-dasharray: 3 2; }
.zone-label  { pointer-events: none; fill: rgba(120, 78, 48, 0.75); font-family: var(--sans); font-size: 6.5px; text-anchor: middle; letter-spacing: 0.03em; }

/* Lignes */
.arete { stroke-linecap: round; cursor: pointer; transition: stroke .15s; }
.arete-standard { stroke: var(--brand); }
.arete-lgv { stroke: var(--gold); }
.arete-chantier { stroke-dasharray: 5 4; opacity: 0.62; }
.arete-travaux { stroke-dasharray: 10 3; }
.arete-mutation { stroke-dasharray: 7 4; stroke: var(--gold); opacity: 0.75; }
.arete-euro { opacity: 0.9; }
.arete-sat { stroke: var(--alerte); }
.arete-sel { filter: drop-shadow(0 0 3px var(--gold)); }
.arete-hit { stroke: transparent; stroke-width: 12; cursor: pointer; }

/* Villes */
.ville { cursor: pointer; }
.ville-hit { fill: transparent; }
.ville-pt { fill: #ffffff; stroke: var(--brand); stroke-width: 1.4; transition: fill .15s, stroke .15s; }
.ville:hover .ville-pt { fill: var(--gold-light); }
.ville-sel .ville-pt { fill: var(--gold); stroke: var(--ink); stroke-width: 2; }
.ville-label { font-family: var(--sans); paint-order: stroke; stroke: var(--paper); stroke-width: 2.6px; stroke-linejoin: round; pointer-events: none; user-select: none; opacity: 0; transition: opacity .12s; }
.ville:hover .ville-label, .ville-sel .ville-label { opacity: 1; }
.ville-label.gauche { text-anchor: end; }
.vl-nom { fill: var(--brand); font-size: 9px; font-weight: 600; }
.vl-pop { fill: var(--muted); font-size: 7px; }

/* Villes européennes frontalières (option) : masquées tant que l'option est off */
.ville-euro, .ville-passage { display: none; }
#carte.euro-actif .ville-euro, #carte.euro-actif .ville-passage { display: inline; }
.ville-euro .ville-pt { fill: var(--paper); stroke: #7a5cae; stroke-width: 1.5; stroke-dasharray: 2.4 1.6; }
.ville-euro:hover .ville-pt { fill: #e7dcf5; }
.ville-euro.ville-sel .ville-pt { fill: #7a5cae; stroke: var(--ink); }
.ville-euro .vl-nom { fill: #6a4c9c; }

/* Point de passage sous la Manche (Calais) : point noir. */
.ville-passage .ville-pt { fill: #111318; stroke: #111318; stroke-width: 1.4; }
.ville-passage:hover .ville-pt { fill: var(--gold); stroke: #111318; }
.ville-passage.ville-sel .ville-pt { fill: var(--gold); stroke: #111318; stroke-width: 2; }
.ville-passage .vl-nom { fill: #111318; font-weight: 600; }
.ville-passage .vl-pop { fill: var(--muted); }

/* Gares */
.gare { cursor: grab; }
.gare:active { cursor: grabbing; }
.gare-hit { fill: transparent; }
.gare-pt { fill: var(--paper); stroke: var(--brand); stroke-width: 1.6; transition: fill .15s, stroke .15s; }
.gare:hover .gare-pt { fill: var(--gold-light); }
.gare-sel .gare-pt { fill: var(--gold); stroke: var(--ink); stroke-width: 2; }
.gare-label { font-family: var(--sans); font-size: 7.5px; fill: var(--brand); paint-order: stroke; stroke: var(--paper); stroke-width: 2.4px; stroke-linejoin: round; pointer-events: none; user-select: none; opacity: 0; transition: opacity .12s; }
.gare:hover .gare-label, .gare-sel .gare-label { opacity: 1; }

/* Panneau tronçon */
.panneau { margin: 0.7rem 0; overflow: hidden; border-color: rgba(184, 154, 90, 0.5); }
.panneau-tete { display: flex; justify-content: space-between; align-items: center; padding: 0.7rem 1rem; background: var(--paper); border-bottom: 1px solid var(--line); }
.panneau-tete strong { font-family: var(--serif); font-weight: 400; color: var(--brand); font-size: 1.25rem; }
.pa-x { background: none; border: none; color: var(--muted); font-size: 1rem; cursor: pointer; }
.pa-x:hover { color: var(--ink); }
.pa-corps { padding: 0.9rem 1rem; display: flex; flex-direction: column; gap: 0.7rem; }
.pa-ligne { display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: 0.85rem; }
.pa-ligne > span { color: var(--muted); }
.pa-etat { font-size: 0.82rem; font-weight: 500; text-align: right; }
.pa-etat.chantier { color: #b5642f; }
.pa-etat.service { color: var(--ok); }
.voies-ctrl { display: flex; align-items: center; gap: 0.7rem; }
.voies-ctrl strong { min-width: 1ch; text-align: center; color: var(--brand); font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.rond { width: 28px; height: 28px; border: 1px solid var(--line); background: transparent; color: var(--ink); font-size: 1.1rem; cursor: pointer; line-height: 1; }
.rond:hover:not(:disabled) { border-color: var(--gold); color: var(--gold); }
.rond:disabled { opacity: 0.35; cursor: default; }
.pa-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem 1.2rem; margin: 0.2rem 0; }
.pa-stats div { display: flex; justify-content: space-between; border-bottom: 1px dotted var(--line); padding: 0.2rem 0; }
.pa-stats dt { color: var(--muted); font-size: 0.72rem; letter-spacing: 0.04em; margin: 0; text-transform: uppercase; }
.pa-stats dd { margin: 0; font-size: 0.82rem; font-weight: 500; color: var(--ink); font-variant-numeric: tabular-nums; }
.pa-stats dd.alerte { color: var(--alerte); }
.pa-boutons { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.btn-muter { background: transparent; border: 1px solid var(--gold); color: var(--brand); padding: 0.45rem 1rem; cursor: pointer; font-size: 0.72rem; font-family: var(--sans); letter-spacing: 0.04em; transition: background .2s, color .2s; }
.btn-muter:hover:not(:disabled) { background: var(--gold); color: var(--ink); }
.btn-muter:disabled { opacity: 0.45; cursor: default; }
.btn-suppr { background: transparent; border: 1px solid var(--alerte); color: var(--alerte); padding: 0.45rem 1rem; cursor: pointer; font-size: 0.7rem; font-family: var(--sans); letter-spacing: 0.12em; text-transform: uppercase; transition: background .2s, color .2s; }
.btn-suppr:hover { background: var(--alerte); color: #fff; }

/* Courbe trésorerie / km */
.graphe-tresor { margin: 0.9rem 0; padding: 1rem 1.1rem 1.1rem; }
.gt-tete { display: flex; align-items: baseline; justify-content: space-between; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 0.5rem; }
.gt-tete strong { font-family: var(--serif); font-weight: 400; color: var(--brand); font-size: 1.2rem; }
.gt-leg { font-size: 0.7rem; color: var(--muted); }
.gt-leg i { display: inline-block; width: 16px; height: 3px; vertical-align: middle; }
.gt-i-tresor { background: var(--brand); }
.gt-i-km { background: var(--gold); border-top: 2px dashed var(--gold); height: 0 !important; }
.gt-fig { margin: 0; }
.gt-fig svg { width: 100%; height: auto; display: block; background: var(--paper); border: 1px solid var(--line); }
.tg-aire { fill: var(--brand); opacity: 0.1; }
.tg-tresor { fill: none; stroke: var(--brand); stroke-width: 2; stroke-linejoin: round; }
.tg-km { fill: none; stroke: var(--gold); stroke-width: 1.6; stroke-dasharray: 5 3; stroke-linejoin: round; }
.tg-1981 { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 2; opacity: 0.7; }
.tg-1981-lbl { font-family: var(--sans); font-size: 8px; fill: var(--muted); }
.tg-axe0 { stroke: var(--line); stroke-width: 1; }
.tg-tick { font-family: var(--sans); font-size: 9px; fill: var(--muted); }
.tg-tick.km { fill: var(--gold); }
.tg-cur { font-family: var(--sans); font-size: 9px; font-weight: 600; fill: var(--brand); }
.tg-vide { font-family: var(--sans); font-size: 11px; fill: var(--muted); }

/* Légende */
.legende { display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem; margin-top: 1rem; color: var(--muted); font-size: 0.76rem; letter-spacing: 0.02em; }
.legende span { display: inline-flex; align-items: center; gap: 0.45rem; }
.ll { width: 20px; height: 3px; display: inline-block; }
.ll-standard { background: var(--brand); }
.ll-lgv { background: var(--gold); }
.ll-chantier { background: var(--brand); opacity: 0.62; }
.ll-sat { background: var(--alerte); }
.ll-gare { width: 9px; height: 9px; background: var(--paper); border: 1.5px solid var(--brand); transform: rotate(45deg); }
.ll-euro { width: 10px; height: 10px; border-radius: 50%; background: var(--paper); border: 1.5px dashed #7a5cae; }
.ll-passage { width: 9px; height: 9px; border-radius: 50%; background: #111318; }
.ll-relief-faible { width: 12px; height: 12px; background: rgba(180, 130, 70, 0.25); border: 1px dashed rgba(180, 130, 70, 0.6); }
.ll-relief-fort   { width: 12px; height: 12px; background: rgba(150, 60, 45, 0.28); border: 1px dashed rgba(150, 60, 45, 0.7); }
.echelle { display: inline-flex; align-items: center; gap: 0.35rem; }
.echelle em { font-style: italic; color: var(--muted); }
.pop { display: inline-block; border-radius: 50%; background: #fff; border: 1.4px solid var(--brand); }
.pop-s { width: 6px; height: 6px; }
.pop-m { width: 11px; height: 11px; }
.pop-l { width: 17px; height: 17px; }

/* Méthode */
.methodo { margin-top: 1.2rem; }
.methodo > summary { cursor: pointer; list-style: none; padding: 0.9rem 1.1rem; font-family: var(--serif); font-size: 1.25rem; color: var(--brand); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.methodo > summary::-webkit-details-marker { display: none; }
.methodo > summary::after { content: "+"; color: var(--gold); font-family: var(--sans); font-size: 1.3rem; line-height: 1; }
.methodo[open] > summary::after { content: "−"; }
.methodo[open] > summary { border-bottom: 1px solid var(--line); }
.methodo-corps { padding: 0.6rem 1.1rem 1.1rem; max-width: 70ch; }
.methodo-corps h3 { font-family: var(--sans); font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.18em; color: var(--gold); margin: 1.3rem 0 0.4rem; font-weight: 600; }
.methodo-corps h3 span { text-transform: none; letter-spacing: 0.02em; color: var(--muted); font-weight: 400; }
.methodo-corps p { margin: 0.4rem 0; font-size: 0.86rem; line-height: 1.6; color: var(--texte, var(--ink)); }
.methodo-intro { color: var(--muted) !important; }
.methodo-corps b { font-weight: 600; color: var(--ink); }
.formule { font-family: ui-monospace, "Cascadia Code", Consolas, monospace; background: var(--paper); border-left: 2px solid var(--gold); padding: 0.5rem 0.8rem; font-size: 0.82rem !important; color: var(--brand) !important; }
.formule span { display: block; font-family: var(--sans); color: var(--muted); font-size: 0.75rem; margin-top: 0.2rem; }
.methodo-note { margin-top: 1.2rem !important; font-size: 0.78rem !important; color: var(--muted) !important; font-style: italic; }

/* Dialogue de fin de partie */
.fin-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem 1.2rem; margin: 0.6rem 0 0.4rem; }
.fin-stats div { display: flex; justify-content: space-between; border-bottom: 1px dotted var(--line); padding: 0.28rem 0; }
.fin-stats dt { color: var(--muted); font-size: 0.74rem; margin: 0; }
.fin-stats dd { margin: 0; font-weight: 600; color: var(--brand); font-variant-numeric: tabular-nums; }
.fin-comparaison { font-size: 0.85rem; color: var(--ink); background: var(--paper); border-left: 2px solid var(--gold); padding: 0.6rem 0.8rem; margin: 0.6rem 0; }
.fin-actions { display: flex; gap: 0.6rem; flex-wrap: wrap; margin: 0.8rem 0; }

/* Mes parties (menu) + classement */
.cr-titre { font-size: .82rem; font-weight: 600; margin: .2rem 0 .4rem; color: var(--brand); }
.cr-contenu { display: flex; flex-direction: column; gap: .35rem; }
.cr-list { list-style: none; margin: .3rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; }
.cr-item { display: flex; align-items: center; gap: .4rem; font-size: .82rem; }
.cr-nom { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-score { font-weight: 600; white-space: nowrap; opacity: .85; }
.cr-fini { color: var(--ok); }
.cr-load, .cr-del { border: 1px solid var(--line); background: var(--paper); border-radius: 6px; cursor: pointer; font-size: .75rem; padding: .15rem .45rem; }
.cr-load:hover, .cr-del:hover { border-color: var(--gold); color: var(--gold); }
.cr-cta { display: block; text-align: center; text-decoration: none; margin-top: .4rem; }
.cr-choix { display: flex; flex-direction: column; gap: .3rem; margin-top: .35rem; padding-top: .35rem; border-top: 1px solid var(--line); }

.reseau-classement { margin: 1rem auto; max-width: 680px; padding: .9rem 1.1rem; }
.rc-tete { font-weight: 400; font-family: var(--serif); color: var(--brand); margin: 0 0 .5rem; font-size: 1.3rem; }
.rc-sous { font-family: var(--sans); font-weight: 400; opacity: .7; font-size: .8rem; }
.rc-tabs { display: flex; flex-wrap: wrap; gap: 2px; margin-bottom: .6rem; }
.rc-tab { border: 1px solid var(--line); background: transparent; color: var(--ink); padding: .4rem .8rem; cursor: pointer; font-family: var(--sans); font-size: .72rem; letter-spacing: .04em; }
.rc-tab:hover { border-color: var(--gold); color: var(--gold); }
.rc-tab.actif { background: var(--gold); color: var(--ink); border-color: var(--gold); font-weight: 500; }
.rc-table { width: 100%; border-collapse: collapse; font-size: .82rem; font-variant-numeric: tabular-nums; }
.rc-table th { text-align: right; font-size: .6rem; text-transform: uppercase; letter-spacing: .12em; color: var(--gold); font-weight: 600; padding: .3rem .5rem; border-bottom: 1px solid var(--line); }
.rc-table th.rc-l, .rc-table td.rc-l { text-align: left; }
.rc-table td { padding: .3rem .5rem; border-bottom: 1px dotted var(--line); }
.rc-table td a { color: var(--brand); border-bottom: 1px dotted rgba(29,58,95,.4); text-decoration: none; }
.rc-table .rc-actif { color: var(--brand); font-weight: 600; }
.rc-rang { color: var(--muted); width: 1.4rem; }

/* Dialogue d'animation */
.anim-dlg { max-width: 560px; }
.anim-etat { font-size: .82rem; color: var(--brand); background: var(--paper); border-left: 2px solid var(--gold); padding: .5rem .7rem; margin: .2rem 0 .8rem; }
.anim-apercu { margin: 0 0 .8rem; border: 1px solid var(--line); background: #12131a; min-height: 60px; }
.anim-apercu video { display: block; width: 100%; height: auto; }
.anim-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .6rem; }

/* Dialogue de partage */
.partage-dlg { max-width: 540px; }
.partage-apercu { margin: 0.4rem 0 0.7rem; border: 1px solid var(--line); background: var(--paper); }
.partage-apercu img { display: block; width: 100%; height: auto; }
.partage-chiffres { font-size: 0.82rem; color: var(--brand); font-variant-numeric: tabular-nums; margin: 0 0 0.9rem; line-height: 1.5; }
.partage-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.8rem; }
.partage-actions .oa-button { padding: 0.55rem 1rem; font-size: 0.66rem; letter-spacing: 0.12em; }
.oa-button.ghost { border-color: var(--line); color: var(--muted); }
.oa-button.ghost:hover { color: var(--paper); background: var(--brand); border-color: var(--brand); }
.partage-info { font-size: 0.78rem; color: var(--brand); background: var(--paper); border-left: 2px solid var(--gold); padding: 0.5rem 0.7rem; margin: 0 0 0.8rem; }
.partage-note { font-size: 0.72rem; color: var(--muted); line-height: 1.5; margin: 0 0 1rem; }

/* Responsive */
@media (max-width: 820px) {
  .tableau { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .tarifs-grille { grid-template-columns: 1fr; gap: 0.8rem; }
  .temps { justify-content: space-between; }
  .temps-frise { order: 3; flex-basis: 100%; }
  .ville-label { font-size: 10px; }
}
@media (max-width: 460px) {
  .tableau { grid-template-columns: 1fr 1fr; }
  .fin-stats { grid-template-columns: 1fr; }
  .temps-actions { flex-basis: 100%; }
  .btn-annee { flex: 1; }
}