/* quiz de culture générale */
.gamepage{background:var(--ink);color:var(--txt);padding:130px 0 110px;min-height:86vh}
.gamepage .wrap{max-width:820px}
.gamepage .crumbs{color:var(--mute)}.gamepage .crumbs a:hover{color:#fff}
.ghero h1{font:500 clamp(2.4rem,6vw,4.2rem)/1 var(--serif);letter-spacing:-.04em;margin:14px 0 18px}
.ghero h1 em{font-style:italic;color:var(--gold)}
.glede{font:300 1.2rem/1.55 var(--serif);color:#cfc9ba;max-width:620px;margin:0 0 28px}
.gstart{display:flex;flex-wrap:wrap;gap:14px 16px;align-items:flex-end;background:var(--ink2);border:1px solid var(--line);border-radius:14px;padding:20px}
.gstart .f{display:flex;flex-direction:column;gap:6px;font-size:.9rem;color:var(--mute);flex:1 1 220px}
.gstart input{background:var(--ink);border:1px solid var(--line);border-radius:8px;color:var(--txt);font:inherit;padding:11px 13px}
.gstart input:focus{outline:2px solid var(--gold);outline-offset:1px}
.gwho{margin:0;flex:1 1 220px;color:#cfc9ba}
.gbtn{display:inline-block;background:var(--gold);color:#17150f;border:0;border-radius:999px;padding:12px 26px;font:600 1rem var(--sans);cursor:pointer;text-decoration:none;transition:transform .15s,filter .15s}
.gbtn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.gbtn:disabled{opacity:.6;cursor:wait}
.gbtn.ghost{background:transparent;color:var(--txt);border:1px solid #4a473e}
.gbtn.ghost:hover{border-color:#fff;color:#fff}
.gmsg{flex-basis:100%;margin:6px 0 0;color:#ff9a86;font-size:.92rem}
.gstart .gmsg{margin:0}

.lb{margin-top:46px}
.lbtabs{display:flex;gap:6px;margin-bottom:14px}
.lbtabs button{background:transparent;border:1px solid var(--line);color:var(--mute);border-radius:999px;padding:8px 18px;font:600 .9rem var(--sans);cursor:pointer}
.lbtabs button[aria-selected="true"]{background:var(--txt);color:var(--ink);border-color:var(--txt)}
.lbl{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.lbl li{display:grid;grid-template-columns:44px 1fr auto auto;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--line);background:var(--ink2)}
.lbl li:first-child{border-top:0}
.lbl li.podium{background:var(--ink3)}
.lbl .lrk{font-size:1.1rem;text-align:center;color:var(--mute)}
.lbl .lnm{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lbl .lnm small{font-weight:500;color:var(--gold);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;margin-left:6px}
.lbl .lsc{color:var(--mute);font-size:.9rem}
.lbl .lpt{font-variant-numeric:tabular-nums;color:var(--gold)}
.lbempty{color:var(--mute);padding:18px 4px}

.gplay{padding-top:10px}
.gtop{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px}
.gcount{font:600 .95rem var(--sans);letter-spacing:.08em;text-transform:uppercase}
.gcount small{color:var(--mute);font-weight:500}
.gtime{font:500 1rem var(--sans);color:var(--mute);font-variant-numeric:tabular-nums}
.gbar{height:5px;background:var(--ink3);border-radius:5px;overflow:hidden;margin:12px 0 34px}
.gbar i{display:block;height:100%;background:var(--gold);transition:width .3s var(--ease)}
.gcat{display:inline-block;color:var(--gold);font:600 .78rem var(--sans);letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px}
.gq{font:500 clamp(1.7rem,4.2vw,2.6rem)/1.15 var(--serif);letter-spacing:-.025em;margin:0 0 30px}
.gch{display:grid;gap:12px}
.gc{display:flex;align-items:center;gap:16px;text-align:left;background:var(--ink2);color:var(--txt);border:1px solid var(--line);border-radius:12px;padding:16px 18px;font:500 1.08rem/1.35 var(--sans);cursor:pointer;transition:border-color .15s,background .15s,transform .15s}
.gc:hover,.gc:focus-visible{border-color:var(--gold);background:var(--ink3);outline:none}
.gc.pick{border-color:var(--gold);background:#2a2412;transform:scale(.99)}
.gl{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--ink);border:1px solid var(--line);font:600 .85rem var(--sans);color:var(--mute)}
.gc.pick .gl{background:var(--gold);color:#17150f;border-color:var(--gold)}
.gwait{color:var(--mute);font-size:1.2rem}

.gscore{display:flex;gap:26px;align-items:center;margin:14px 0 30px;flex-wrap:wrap}
.gbig{font:500 clamp(4.5rem,15vw,8rem)/.9 var(--serif);letter-spacing:-.05em;color:var(--gold)}
.gbig small{font-size:.4em;color:var(--mute);letter-spacing:0}
.gscore b{display:block;font:500 clamp(1.5rem,4vw,2.2rem)/1.1 var(--serif)}
.gscore span{display:block;color:#cfc9ba;margin-top:4px}
.gscore .grk{color:var(--gold);font-weight:600}
.gshare{background:var(--ink2);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:22px}
.gshare h3{margin:0 0 14px;font:600 .8rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.gsb{display:flex;flex-wrap:wrap;gap:10px}
.gsb .gbtn{padding:10px 20px;font-size:.95rem}
.gshare .gmsg{color:var(--gold);margin-top:12px}
.gbtns{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:30px}
.grev{border-top:1px solid var(--line);padding-top:18px}
.grev summary{cursor:pointer;font:600 .8rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:12px}
.grev ol{margin:0;padding-left:22px;display:grid;gap:14px}
.grev li b{display:block;font-weight:600}
.grev li span{display:block;font-size:.95rem}
.grev li.ok span{color:#8ad9a6}.grev li.ko span{color:#ff9a86}.grev .you{color:var(--mute)!important}

.quizban{display:grid;grid-template-columns:auto 1fr auto;gap:6px 22px;align-items:center;border:1px solid var(--line);background:var(--ink2);border-radius:16px;padding:26px 30px;color:var(--txt);text-decoration:none;transition:border-color .2s,transform .2s}
.quizban:hover{border-color:var(--gold);transform:translateY(-2px)}
.quizban .qb-k{grid-row:1/3;background:var(--gold);color:#17150f;font:700 .72rem var(--sans);letter-spacing:.12em;text-transform:uppercase;border-radius:999px;padding:6px 12px;align-self:center}
.quizban b{font:500 clamp(1.4rem,3vw,2rem)/1.1 var(--serif);letter-spacing:-.02em}
.quizban>span:nth-of-type(2){grid-column:2;color:#cfc9ba}
.quizban .cta{grid-column:3;grid-row:1/3;font-weight:600;color:var(--gold)}
@media(max-width:640px){
  .gamepage{padding-top:110px}
  .lbl li{grid-template-columns:34px 1fr auto;}.lbl .lsc{display:none}
  .quizban{grid-template-columns:1fr;padding:22px}.quizban .qb-k{grid-row:auto;justify-self:start}.quizban .cta{grid-column:1;grid-row:auto}.quizban>span:nth-of-type(2){grid-column:1}
}