/* ==========================================================================
   Mode histoire (histoire.html, assets/js/histoire.js)
   ========================================================================== */
.hist { padding: 24px 0 72px; }
.hist-page { max-width: 640px; margin: 0 auto; }
.hist-tete h1, .hist-titre { font-size: clamp(28px, 6vw, 40px); line-height: 1.12; margin: 6px 0 8px; }
.hist-liste { display: grid; gap: 10px; margin-top: 22px; }
.hist-carte { display: flex; align-items: center; gap: 14px; width: 100%; padding: 18px; border-radius: 20px; background: var(--bg-card); border: 1px solid var(--b1); border-bottom-width: 3px; color: var(--t0); font: inherit; text-align: left; cursor: pointer; }
.hist-carte:hover { background: var(--bg-card-hover); }
.hist-num { font-size: 22px; color: #FFB86B; }
.hist-txt { flex: 1; }
.hist-txt strong { display: block; font-size: 17px; font-weight: 600; }
.hist-txt small { display: block; margin-top: 3px; font-size: 13px; color: var(--t2); }
.tag-libre { background: rgba(46, 189, 133, 0.14); color: var(--bull-text); }
.tag-plus { background: rgba(207, 196, 255, 0.14); color: var(--lilac); display: inline-flex; align-items: center; gap: 4px; }
.tag-histoire { background: rgba(255, 184, 107, 0.14); color: #FFB86B; }
.hist-mention { margin-top: 22px; }
.hist-haut { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.hist-haut .lien-btn { display: inline-flex; align-items: center; gap: 4px; }
.hist-carte-graphe { margin-top: 14px; padding: 14px 14px 8px; border-radius: 20px; background: var(--bg-card); border: 1px solid var(--b1); }
.hist-graphe { display: block; width: 100%; height: auto; margin-top: 6px; }
.hist-ref { stroke: rgba(255, 255, 255, 0.12); stroke-dasharray: 4 6; }
.hist-ligne { fill: none; stroke: #93B4FF; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.hist-ligne.is-baisse { stroke: #F5B8DA; }
.hist-pt { fill: #93B4FF; }
.hist-pt.is-fin { fill: #FFFFFF; }
.hist-label { fill: var(--t2); font: 500 11px var(--mono, "DM Mono", monospace); }
.hist-dates { display: flex; justify-content: space-between; font-size: 12px; color: var(--t3); padding: 0 8px; }
.hist-recit { display: flex; align-items: flex-end; gap: 10px; margin-top: 16px; }
.hist-recit img { flex: none; }
.hist-bulle { flex: 1; padding: 14px 16px; border-radius: 18px; background: var(--bg-card); border: 1px solid var(--b2); outline: none; }
.hist-bulle p { margin: 0 0 8px; line-height: 1.55; }
.hist-bulle p:last-child { margin-bottom: 0; }
.hist-choisi { color: var(--t2); }
.hist-pied { margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap; }
.hist-pied > .btn:only-child { width: 100%; }
.hist-choix { display: grid; gap: 8px; width: 100%; }
.hist-option { width: 100%; padding: 14px 16px; border-radius: 16px; background: var(--bg-card); border: 2px solid var(--b2); border-bottom-width: 4px; color: var(--t0); font: inherit; font-size: 15px; text-align: left; cursor: pointer; }
.hist-option:hover { border-color: #93B4FF; }
.hist-sources { display: grid; gap: 6px; margin: 10px 0; }
.hist-sources a { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; }