/* Cours en direct + graphique — composant partagé des lettres Carnet de Bourse.
   Utilise les jetons de couleur de la lettre (--ink, --muted, --line, --accent, --up, --down, --card, --bg2). */
.lvx{margin-top:30px;padding-top:26px;border-top:1px solid var(--line);position:relative}
.lvx .lvh{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.lvx .lvk{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted)}
.lvx .lvdot{width:8px;height:8px;border-radius:50%;background:var(--up);box-shadow:0 0 0 0 color-mix(in srgb,var(--up) 50%,transparent)}
.lvx.ok .lvdot{animation:lvpulse 2s ease-out infinite}
.lvx.err .lvdot{background:var(--muted);animation:none}
@keyframes lvpulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--up) 55%,transparent)}100%{box-shadow:0 0 0 10px transparent}}
.lvx .lvp{display:flex;align-items:baseline;gap:12px;margin-top:6px;flex-wrap:wrap}
.lvx .lvp b{font-size:clamp(34px,5vw,46px);font-weight:800;letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums}
.lvx .lvc{font-size:15px;font-weight:700;padding:4px 10px;border-radius:999px;font-variant-numeric:tabular-nums;background:color-mix(in srgb,var(--muted) 14%,transparent);color:var(--muted)}
.lvx .lvc.up{color:var(--up);background:color-mix(in srgb,var(--up) 14%,transparent)}
.lvx .lvc.down{color:var(--down);background:color-mix(in srgb,var(--down) 13%,transparent)}
.lvx .lvt{font-size:13px;color:var(--muted);margin-top:8px}
.lvx .lvseg{display:inline-flex;padding:3px;border-radius:999px;background:color-mix(in srgb,var(--muted) 14%,transparent)}
.lvx .lvseg button{font:inherit;font-size:13px;font-weight:600;border:0;background:transparent;color:var(--muted);padding:6px 14px;border-radius:999px;cursor:pointer;transition:background .25s,color .25s}
.lvx .lvseg button.on{background:var(--card);color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.12)}
.lvx .lvseg button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.lvx .lvbox{position:relative;margin-top:18px;height:250px}
.lvx svg{display:block;width:100%;height:100%;overflow:visible;touch-action:pan-y}
.lvx .lvline{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.lvx .lvarea{opacity:1;transition:opacity .9s ease .4s}
.lvx .lvref{stroke-width:1.2;stroke-dasharray:4 5}
.lvx .lvref.iv{stroke:var(--ink);opacity:.45}
.lvx .lvref.buy{stroke:var(--up);opacity:.8}
.lvx .lvzone{fill:var(--up);opacity:.08}
.lvx .lvlab{font-size:11.5px;font-weight:600;fill:var(--muted);font-variant-numeric:tabular-nums}
.lvx .lvlab.buy{fill:var(--up)}
.lvx .lvax{font-size:11px;fill:var(--muted)}
.lvx .lvend{fill:var(--accent)}
.lvx .lvhalo{fill:var(--accent);opacity:.25;transform-box:fill-box;transform-origin:center}
.lvx.ok .lvhalo{animation:lvhalo 2.2s ease-out infinite}
@keyframes lvhalo{0%{transform:scale(.6);opacity:.45}100%{transform:scale(2.4);opacity:0}}
.lvx .lvcross{stroke:var(--muted);stroke-width:1;opacity:0}
.lvx .lvhov{fill:var(--card);stroke:var(--accent);stroke-width:2.5;opacity:0}
.lvx .lvtip{position:absolute;top:0;pointer-events:none;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:7px 11px;font-size:12.5px;line-height:1.35;white-space:nowrap;box-shadow:0 8px 24px rgba(0,0,0,.14);opacity:0;transition:opacity .15s}
.lvx .lvtip b{display:block;font-size:15px;font-variant-numeric:tabular-nums}
.lvx .lvtip span{color:var(--muted)}
.lvx .lvfoot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px;font-size:12.5px;color:var(--muted)}
.lvx .lvperf{font-weight:700;font-variant-numeric:tabular-nums}
.lvx .lvperf.up{color:var(--up)} .lvx .lvperf.down{color:var(--down)}
.lvx .lvmsg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font-size:14px;color:var(--muted);padding:0 20px}
.lvx.ok .lvmsg{display:none}
.lvx .lvsk{position:absolute;left:0;right:0;top:50%;height:2px;background:linear-gradient(90deg,transparent,var(--line),transparent);background-size:200% 100%;animation:lvsk 1.4s linear infinite}
.lvx.ok .lvsk,.lvx.err .lvsk{display:none}
@keyframes lvsk{to{background-position:-200% 0}}
.cr4 .lvold{display:block;font-size:12px;color:var(--muted);font-weight:400;margin-top:2px}
@media (max-width:760px){.lvx .lvbox{height:210px}.lvx .lvlab{font-size:10.5px}}
@media (prefers-reduced-motion:reduce){.lvx.ok .lvdot,.lvx.ok .lvhalo,.lvx .lvsk{animation:none}}