/* Fonctions publiques — charte du site (Cormorant Garamond + Montserrat, or #b89a5a),
   accent « sciences » indigo (#3b2f7a). Thème clair. Reprend la structure de
   Nucleoguessr (HUD, classement, partage, sources). */
:root{
  --ink:#1a1814; --paper:#f2f5fa; --paper-dark:#e7ecf3; --gold:#b89a5a; --muted:#6b7280;
  --navy:#3b2f7a; --navy2:#4a3d93; --grid:#dfe3ee; --axis:#8b93a7;
  --target:#b89a5a; --mine:#3b2f7a;
  --ok:#3f9d54; --ko:#d64545; --nav-h:72px;
}
*{box-sizing:border-box}
html,body{margin:0}
html{scroll-padding-top:calc(var(--nav-h) + 10px)}
body{background:var(--paper);color:var(--ink);font-family:'Montserrat',system-ui,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:#4a3d93}
.entete{max-width:1080px;margin:0 auto;padding:calc(var(--nav-h) + 1.6rem) 1.1rem 0;text-align:center}
@media (max-width:560px){.entete{padding-top:calc(var(--nav-h) + 1rem)}}
.entete .eyebrow{font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin:0 0 .5rem;font-weight:600}
.entete h1{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(2.1rem,5vw,3.1rem);margin:0;color:var(--navy);line-height:1.05}
.entete .accroche{max-width:660px;margin:.8rem auto 0;color:#3a4250;font-size:1.02rem}
.entete .filet{width:64px;height:2px;background:var(--gold);margin:1.3rem auto .2rem;opacity:.7}

main{max-width:1180px;margin:0 auto;padding:1.2rem 1.1rem 2rem}

.intro{background:#fff;border:1px solid rgba(59,47,122,.12);border-radius:14px;padding:1.4rem 1.5rem;margin:0 auto 1.4rem;max-width:760px;box-shadow:0 6px 24px rgba(59,47,122,.06)}
.intro h2{font-family:'Cormorant Garamond',serif;color:var(--navy);font-size:1.5rem;margin:.1rem 0 .5rem}
.intro ul{margin:.4rem 0 1rem;padding-left:1.1rem;color:#3a4250}
.intro li{margin:.28rem 0}
.formula-demo{font-family:'Cambria Math','Latin Modern Math',serif;background:var(--paper-dark);border-radius:8px;padding:.5rem .8rem;display:inline-block;margin:.2rem 0}

.btn-start,.btn-primary{display:inline-block;border:none;cursor:pointer;font-family:'Montserrat',sans-serif;font-weight:600;background:var(--navy);color:#fff;border-radius:999px;padding:.7rem 2rem;font-size:1.05rem;letter-spacing:.02em;transition:transform .12s ease,box-shadow .12s ease,background .12s;box-shadow:0 4px 14px rgba(59,47,122,.28)}
.btn-start:hover,.btn-primary:hover{transform:translateY(-1px);background:var(--navy2)}
.btn-start:active{transform:translateY(0)}
.btn-ghost{background:transparent;color:var(--navy);border:1px solid rgba(59,47,122,.35);box-shadow:none}
.btn-ghost:hover{background:rgba(59,47,122,.06)}

/* Zone de jeu : graphe (gauche) + constructeur (droite) */
.game{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,440px);gap:1.4rem;align-items:start}
@media (max-width:920px){.game{grid-template-columns:1fr}}
.panel{background:#fff;border:1px solid rgba(59,47,122,.12);border-radius:14px;padding:1rem;box-shadow:0 6px 24px rgba(59,47,122,.06)}

.hud{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:.7rem;flex-wrap:wrap}
.hud .chip{background:var(--paper-dark);border-radius:999px;padding:.3rem .85rem;font-weight:600;font-size:.92rem;color:var(--navy);font-variant-numeric:tabular-nums}
.hud .chip b{color:var(--ink)}
.hud .timer{font-size:1.05rem}
.hud .timer.low{color:#fff;background:var(--ko);animation:tpulse 1s ease infinite}
@keyframes tpulse{0%,100%{opacity:1}50%{opacity:.6}}

/* Graphe */
.plot-wrap{position:relative;width:100%}
#plot{width:100%;height:auto;display:block;background:#fff;border-radius:10px;border:1px solid var(--grid);touch-action:manipulation}
.legend{display:flex;gap:1.2rem;justify-content:center;margin:.55rem 0 0;font-size:.85rem;color:#3a4250;flex-wrap:wrap}
.legend .k{display:inline-flex;align-items:center;gap:.4rem}
.legend .sw{width:20px;height:3px;border-radius:2px;display:inline-block}
.legend .sw.t{background:var(--target)}
.legend .sw.m{background:var(--mine)}

/* Constructeur */
.builder h3{font-family:'Cormorant Garamond',serif;color:var(--navy);font-size:1.25rem;margin:.1rem 0 .5rem}
.type-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.35rem;margin-bottom:.7rem}
.type-btn{border:1px solid rgba(59,47,122,.22);background:#fff;color:var(--navy);border-radius:9px;padding:.4rem .3rem;cursor:pointer;font-weight:600;font-size:.82rem;text-align:center;line-height:1.15}
.type-btn:hover{background:rgba(59,47,122,.06)}
.type-btn.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.mine-formula{font-family:'Cambria Math','Latin Modern Math',serif;text-align:center;font-size:1.15rem;color:var(--navy);background:var(--paper-dark);border-radius:8px;padding:.5rem;margin:.2rem 0 .7rem;min-height:2.2rem;word-break:break-word}
.coefs{display:flex;flex-direction:column;gap:.5rem}
/* Une fois un type choisi, on FIGE la hauteur de la zone de coefficients du jeu
   (pas des cartes de résultat) : le bouton « Valider » garde toujours la même
   place, quel que soit le type ou le degré → aucun clic accidentel. */
#coefs.filled{min-height:330px}
.coef-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem}
.coef-row .lab{font-size:.9rem;color:#3a4250;font-weight:600}
.coef-row .lab em{color:var(--muted);font-weight:400;font-style:normal;font-size:.8rem}
.stepper{display:inline-flex;align-items:center;gap:.15rem}
.stepper button{width:2rem;height:2rem;border:1px solid rgba(59,47,122,.25);background:#fff;color:var(--navy);border-radius:8px;font-size:1.1rem;font-weight:700;cursor:pointer;line-height:1}
.stepper button:hover{background:rgba(59,47,122,.08)}
.stepper .val{min-width:2.4rem;text-align:center;font-weight:700;font-variant-numeric:tabular-nums;font-size:1.05rem;color:var(--ink)}
.deg-ctl{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.4rem .1rem;border-bottom:1px dashed rgba(59,47,122,.18);margin-bottom:.2rem}

.prox{margin:.9rem 0 .2rem}
.prox-bar{height:12px;border-radius:999px;background:var(--paper-dark);overflow:hidden}
.prox-fill{height:100%;width:0;background:linear-gradient(90deg,#d64545,#e0a63a,#3f9d54);transition:width .18s ease}
.prox-txt{text-align:center;font-size:.9rem;color:var(--muted);margin:.35rem 0 0;font-weight:600}
.builder-actions{display:flex;gap:.6rem;justify-content:center;margin-top:.9rem;flex-wrap:wrap}
.match-flash{animation:mflash .5s ease}
@keyframes mflash{0%{background:#fff}40%{background:rgba(63,157,84,.25)}100%{background:#fff}}

/* Résultat */
.reveal{margin-top:1.4rem}
.final-card{background:#fff;border:1px solid rgba(59,47,122,.14);border-radius:14px;padding:1.4rem;text-align:center;box-shadow:0 6px 24px rgba(59,47,122,.07);max-width:760px;margin:0 auto 1.2rem}
.final-score{font-family:'Cormorant Garamond',serif;font-size:3rem;color:var(--navy);font-weight:600;line-height:1;margin:.2rem 0}
.final-score small{font-size:1.3rem;color:var(--muted)}
.final-time{font-size:1.1rem;color:#3a4250;font-variant-numeric:tabular-nums}
.final-actions{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-top:1rem}
.save-msg{margin:.6rem 0 0;font-size:.92rem;color:var(--muted)}
.save-msg a{color:#4a3d93;font-weight:600}
/* Résultat interactif : une carte par fonction (courbe + réponse + rejeu) */
.recap{max-width:980px;margin:0 auto 1.2rem;display:grid;gap:.7rem}
.res-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;background:#fff;border:1px solid rgba(59,47,122,.12);border-radius:12px;padding:1rem;align-items:start;box-shadow:0 4px 16px rgba(59,47,122,.05)}
@media (max-width:720px){.res-card{grid-template-columns:1fr}}
.res-plot canvas{width:100%;height:auto;display:block;background:#fff;border:1px solid var(--grid);border-radius:10px}
.res-side{display:flex;flex-direction:column;gap:.45rem}
.res-head{font-family:'Cormorant Garamond',serif;font-size:1.25rem;color:var(--navy);display:flex;align-items:center;gap:.4rem}
.res-head .ic{font-size:1rem}
.res-line{display:flex;flex-direction:column;gap:.1rem}
.res-line .res-k{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);font-weight:600}
.res-line .fx{font-family:'Cambria Math','Latin Modern Math',serif;color:var(--navy);font-weight:600;font-size:.98rem;word-break:break-word}
.res-play{margin-top:.3rem;border-top:1px dashed rgba(59,47,122,.16);padding-top:.5rem}
.res-play summary{cursor:pointer;font-weight:600;color:var(--navy);font-size:.9rem;list-style:none}
.res-play summary::-webkit-details-marker{display:none}
.res-play summary:hover{color:var(--navy2)}
.mini-builder{margin-top:.6rem}
.mini-builder .mine-formula{font-size:1rem;min-height:auto;padding:.4rem}
.mini-builder .tpl-formula{font-size:1rem;padding:.4rem}
.mini-builder .prox{margin:.7rem 0 0}

/* Classement */
.lb{max-width:760px;margin:0 auto 1.4rem}
.lb h2{font-family:'Cormorant Garamond',serif;color:var(--navy);font-size:1.6rem;text-align:center;margin:.2rem 0 .7rem}
.today-plays{text-align:center;color:var(--muted);font-size:.9rem;margin:-.3rem 0 .7rem;font-variant-numeric:tabular-nums}
.today-plays b{color:var(--navy)}
.lb-tabs{display:flex;justify-content:center;gap:.4rem;margin-bottom:.7rem;flex-wrap:wrap}
.lb-tab{border:1px solid rgba(59,47,122,.25);background:#fff;color:var(--navy);border-radius:999px;padding:.35rem 1rem;cursor:pointer;font-weight:600;font-size:.9rem}
.lb-tab.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.lb-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid rgba(59,47,122,.12);border-radius:12px;overflow:hidden}
.lb-table th,.lb-table td{padding:.5rem .7rem;text-align:left;border-bottom:1px solid rgba(59,47,122,.08);font-size:.94rem}
.lb-table th{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);font-weight:600}
.lb-table td.num{text-align:right;font-variant-numeric:tabular-nums}
.lb-rank{color:var(--muted);width:2.2rem;text-align:center}
.lb-player{display:flex;align-items:center;gap:.5rem}
.lb-player img{width:26px;height:26px;border-radius:50%;object-fit:cover;background:var(--paper-dark)}
.lb-player a{color:#22303f;text-decoration:none;font-weight:600}
.lb-player a:hover{text-decoration:underline}
.lb-row-me{background:rgba(184,154,90,.12)}
.lb-empty{text-align:center;color:var(--muted);padding:1rem}

.share-row{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin:1rem auto 0;max-width:760px}
.share-btn{border:1px solid rgba(59,47,122,.25);background:#fff;color:var(--navy);border-radius:999px;padding:.45rem 1.1rem;cursor:pointer;font-weight:600;font-size:.9rem;text-decoration:none;display:inline-block}
.share-btn:hover{background:rgba(59,47,122,.06)}
.share-tw{border-color:#1d9bf0;color:#1d9bf0}
.share-bsky{border-color:#1185fe;color:#1185fe}

.sources-licences{max-width:820px;margin:2rem auto 1.5rem;padding:.9rem 1.1rem;border:1px solid rgba(184,154,90,.28);border-radius:8px;background:rgba(184,154,90,.05);color:#5a6470;font-size:12.5px;line-height:1.6}
.sources-licences h2{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:#b89a5a;margin:0 0 .45rem;font-weight:600}
.sources-licences a{color:#8a6d3b}

.hidden{display:none!important}
footer{border-top:1px solid rgba(59,47,122,.1);margin-top:2rem}
.footer-inner{max-width:1080px;margin:0 auto;padding:1.4rem 1.1rem;display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;color:var(--muted);font-size:.85rem}
.footer-logo{font-family:'Cormorant Garamond',serif;font-size:1.15rem;color:var(--navy);display:flex;align-items:center}
.footer-links{list-style:none;display:flex;gap:1rem;margin:0;padding:0}
.footer-links a{color:var(--muted);text-decoration:none}
.footer-links a:hover{color:var(--navy)}

/* Gabarit paramétrique « A B C » du type choisi */
.tpl-formula{font-family:'Cambria Math','Latin Modern Math','Times New Roman',serif;text-align:center;font-size:1.18rem;color:var(--navy);background:var(--paper-dark);border-radius:8px;padding:.5rem;margin:0 0 .7rem;letter-spacing:.02em}