/* Estime : styles communs à presal/, gagner/, ballons/ (copié à l'identique dans chaque dossier). */
.hud{ display:flex; justify-content:space-between; align-items:center; margin-top:14px; min-height:28px; }
.dots{ display:flex; gap:6px; }
.dot{ width:10px; height:10px; border-radius:50%; background:var(--c, var(--raised-3)); transition:background-color .3s ease, transform .3s var(--ease-out); }
.dot.is-cur{ box-shadow:0 0 0 2px var(--bg), 0 0 0 3px var(--u); }
.score{ font-size:14px; color:var(--fg-3); }
.score b{ color:var(--fg); font-size:20px; font-weight:560; letter-spacing:-.02em; margin-right:2px; }
.qcard{ margin-top:14px; padding:20px 20px 18px; }
.q__kicker{ margin:0; color:var(--u); font-size:13px; font-weight:560; letter-spacing:.01em; }
.q{ margin:6px 0 0; font-size:clamp(20px, 5.4vw, 25px); font-weight:500; letter-spacing:-.03em; line-height:1.2; text-wrap:balance; }
.q__sub{ margin:8px 0 0; color:var(--fg-3); font-size:14px; line-height:1.4; }
.readout{ margin-top:18px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.readout__num{ margin:0; font-size:clamp(32px, 10vw, 46px); font-weight:500; letter-spacing:-.05em; line-height:1; font-variant-numeric:tabular-nums; min-width:0; overflow-wrap:anywhere; }
.nudge{ display:flex; gap:6px; flex:none; }
.nudge button{ width:44px; height:44px; border-radius:50%; background:var(--raised-2); border:1px solid var(--line); font-size:22px; line-height:1; color:var(--fg); transition:transform .12s var(--ease-out); }
.nudge button:active{ transform:scale(.92); }
.is-off .nudge, .nudge.is-off{ opacity:.25; pointer-events:none; }
/* piste log horizontale */
.lt{ position:relative; margin:14px 0 0; height:76px; touch-action:pan-y; cursor:grab; user-select:none; -webkit-user-select:none; }
.lt.is-off{ pointer-events:none; opacity:.4; }
.lt__rail{ position:absolute; left:0; right:0; top:28px; height:8px; border-radius:var(--r-pill); background:linear-gradient(90deg, var(--raised-3), color-mix(in srgb, var(--u) 45%, var(--raised-3))); }
.lt__ticks{ position:absolute; inset:0; pointer-events:none; }
.lt__tick{ position:absolute; top:46px; transform:translateX(-50%); font-size:11px; color:var(--fg-4); white-space:nowrap; font-variant-numeric:tabular-nums; }
.lt__tick:first-child{ transform:none; } .lt__tick:first-child::before{ left:0; }
.lt__tick:last-child{ transform:translateX(-100%); } .lt__tick:last-child::before{ left:auto; right:0; }
.lt__tick::before{ content:""; position:absolute; left:50%; top:-12px; width:1px; height:8px; background:var(--fg-4); }
.lt__thumb{ position:absolute; top:18px; width:28px; height:28px; margin-left:-14px; border-radius:50%; background:var(--fg); box-shadow:0 4px 14px rgba(0,0,0,.5), 0 0 0 6px rgba(255,255,255,.08); transition:transform .16s var(--ease-out); pointer-events:none; }
.lt.is-drag .lt__thumb{ transform:scale(1.15); }
.act{ margin-top:14px; }
.hint{ margin:10px 0 0; color:var(--fg-3); font-size:13px; text-align:center; }
/* résultat de manche */
.res{ margin-top:14px; padding:18px 20px; }
.res__top{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.res__verdict{ margin:0; font-size:19px; font-weight:560; letter-spacing:-.02em; color:var(--c); }
.res__pts{ margin:0; font-size:15px; color:var(--fg-2); font-variant-numeric:tabular-nums; }
.res__pts b{ font-size:26px; color:var(--fg); font-weight:500; letter-spacing:-.03em; }
.res__big{ margin:8px 0 0; font-size:clamp(28px, 8vw, 38px); font-weight:500; letter-spacing:-.04em; line-height:1.05; font-variant-numeric:tabular-nums; }
.res__line{ margin:8px 0 0; color:var(--fg-2); font-size:15px; line-height:1.45; }
.res__line b{ color:var(--fg); font-weight:560; }
.res__src{ margin:12px 0 0; padding-top:10px; border-top:1px solid var(--line); color:var(--fg-3); font-size:12px; line-height:1.5; }
.res__src a{ color:var(--fg-2); text-underline-offset:3px; word-break:break-word; }
.res.is-in{ animation:rin .36s var(--ease-out) both; }
@keyframes rin{ from{ opacity:0; transform:translateY(8px); } }
/* fin */
.recap{ list-style:none; margin:16px 0 0; padding:0; display:grid; gap:6px; }
.recap li{ display:grid; grid-template-columns:24px 1fr auto; gap:8px; align-items:baseline; font-size:14px; color:var(--fg-2); }
.recap__n{ min-width:0; }
.recap__v{ color:var(--fg); font-weight:560; text-align:right; }
@media (prefers-reduced-motion:reduce){ .res.is-in{ animation:none; } .dot{ transition:none; } }

/* ---------- souris, clavier, grands écrans (11 nov. 2026) ---------- */
.lt.is-drag{ cursor:grabbing; }
.lt:focus-visible .lt__thumb{ box-shadow:0 0 0 4px var(--u), 0 4px 14px rgba(0,0,0,.5); }
@media (hover:hover) and (pointer:fine){
  .lt:not(.is-off):hover .lt__thumb{ transform:scale(1.08); }
  .lt.is-drag:hover .lt__thumb{ transform:scale(1.15); }
  .nudge button:hover{ background:var(--raised-3); }
}
@media (min-width:700px){
  .hud{ margin-top:18px; }
  .qcard{ padding:26px 28px 24px; }
  .q{ font-size:30px; }
  .q__sub{ font-size:15px; }
  .readout__num{ font-size:52px; }
  .lt{ height:84px; }
  .lt__tick{ font-size:12px; }
  .res{ padding:22px 26px; }
  .res__big{ font-size:44px; }
  .res__line{ font-size:16px; }
  .recap li{ font-size:15px; }
}
@media (min-width:1000px){
  .q__kicker{ font-size:14px; }
  .nudge button{ width:52px; height:52px; font-size:24px; }
  .act .hint{ margin-top:12px; }
}
