:root{color-scheme:dark;--green:#51ff91;--red:#ff3b52;--muted:#9a9a9a}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#000;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}
body{background:radial-gradient(circle at 50% 40%,#111 0,#050505 42%,#000 78%)}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.075;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E")}
.game-header{position:fixed;top:0;left:0;right:0;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:18px clamp(18px,4vw,56px);background:linear-gradient(#000,transparent);font-size:.92rem}
.back{color:#ddd;text-decoration:none;border:1px solid #333;border-radius:999px;padding:10px 15px;background:rgba(0,0,0,.55);backdrop-filter:blur(10px)}
.back:hover{border-color:#777}
.header-right{display:flex;align-items:center;gap:12px}
.sound-toggle{color:#ddd;border:1px solid #333;border-radius:999px;padding:10px 14px;background:rgba(0,0,0,.55);backdrop-filter:blur(10px);cursor:pointer;font-weight:800;transition:.2s}
.sound-toggle:hover{border-color:#777;transform:translateY(-1px)}
.sound-toggle[aria-pressed="true"]{color:#888}
.live{color:#bdbdbd;display:flex;align-items:center;gap:7px}.live span{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 15px var(--green);animation:pulse 1.4s infinite}.live strong{color:#fff}
.game-area{position:relative;width:100%;height:100%;isolation:isolate}
.intro{position:absolute;inset:0;z-index:20;display:grid;place-content:center;text-align:center;padding:24px;background:rgba(0,0,0,.82);backdrop-filter:blur(16px);transition:.55s ease}
.intro.out{opacity:0;visibility:hidden;transform:scale(1.06)}
.warning{margin:0 0 12px;color:#ffcf58;text-transform:uppercase;letter-spacing:.2em;font-size:.78rem;font-weight:800}
.intro h1{font-size:clamp(2.8rem,9vw,8rem);line-height:.86;letter-spacing:-.07em;margin:0 auto 24px;max-width:1000px}
.intro p:not(.warning){color:#aaa;font-size:clamp(1rem,2vw,1.25rem);margin:0 auto 28px}
.intro button{justify-self:center;border:0;border-radius:999px;padding:15px 28px;background:#fff;color:#000;font-weight:900;font-size:1rem;cursor:pointer;transition:.2s}.intro button:hover{transform:scale(1.05)}
.hud{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));z-index:15;transform:translateX(-50%);display:flex;gap:8px;background:rgba(8,8,8,.72);border:1px solid #292929;border-radius:22px;padding:8px;backdrop-filter:blur(16px);box-shadow:0 20px 60px rgba(0,0,0,.5)}
.hud div{min-width:105px;padding:10px 17px;text-align:center;border-radius:15px;background:rgba(255,255,255,.035)}
.hud span{display:block;color:#777;text-transform:uppercase;letter-spacing:.13em;font-size:.62rem;margin-bottom:3px}.hud strong{font-size:1.35rem}
.matheo{position:absolute;z-index:8;width:clamp(92px,12vw,170px);height:clamp(92px,12vw,170px);padding:0;border:0;border-radius:50%;background:radial-gradient(circle,#222,#000);cursor:pointer;filter:drop-shadow(0 14px 22px rgba(0,0,0,.8));transition:left .42s cubic-bezier(.2,.8,.2,1),top .42s cubic-bezier(.2,.8,.2,1),transform .12s ease,opacity .2s ease;animation:spawn .3s cubic-bezier(.2,1.6,.3,1)}
.matheo:hover{transform:scale(1.08) rotate(-3deg)}.matheo:active{transform:scale(.9)}.matheo img{width:142%;height:142%;object-fit:contain;position:absolute;left:-21%;top:-12%;pointer-events:none}.hidden{display:none}.matheo.respawning{opacity:0;transform:scale(.25) rotate(18deg);pointer-events:none}.matheo.shiny{background:conic-gradient(from 0deg,#ff2d55,#ffb000,#fff34d,#39ff88,#23d5ff,#7a5cff,#ff3fd1,#ff2d55);box-shadow:0 0 20px #fff,0 0 40px #7a5cff,0 0 70px #23d5ff;animation:spawn .3s cubic-bezier(.2,1.6,.3,1),rainbowSpin 1.2s linear infinite}.matheo.shiny:before{content:"SHINY +10";position:absolute;left:50%;top:-28px;transform:translateX(-50%);white-space:nowrap;font-size:.7rem;font-weight:1000;letter-spacing:.12em;color:#fff;text-shadow:0 0 10px #fff,0 0 20px #ff3fd1}.matheo.shiny img{filter:saturate(1.25) contrast(1.08)}
.reveal-word{position:fixed;left:50%;top:45%;z-index:25;transform:translate(-50%,-50%) scale(.5);font-weight:1000;font-size:clamp(4rem,17vw,15rem);line-height:.8;letter-spacing:-.08em;text-align:center;text-transform:uppercase;opacity:0;pointer-events:none;text-shadow:0 10px 50px currentColor}.reveal-word.show{animation:word .82s cubic-bezier(.2,.9,.25,1)}.reveal-word.good{color:var(--green)}.reveal-word.bad{color:var(--red)}
.flash{position:fixed;inset:0;z-index:22;opacity:0;pointer-events:none}.flash.good{background:rgba(50,255,120,.12);animation:flash .32s}.flash.bad{background:rgba(255,30,60,.13);animation:flash .32s}
@keyframes rainbowSpin{to{filter:hue-rotate(360deg) drop-shadow(0 14px 22px rgba(0,0,0,.8))}}
@keyframes spawn{from{opacity:0;transform:scale(.2) rotate(20deg)}to{opacity:1;transform:scale(1)}}
@keyframes word{0%{opacity:0;transform:translate(-50%,-50%) scale(.35) rotate(-4deg)}20%{opacity:1;transform:translate(-50%,-50%) scale(1.08) rotate(1deg)}65%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-62%) scale(1.15)}}
@keyframes flash{50%{opacity:1}}
@keyframes pulse{50%{opacity:.35;transform:scale(.7)}}
@media(max-width:650px){.game-header{align-items:flex-start;gap:10px}.header-right{align-items:flex-end;flex-direction:column-reverse;gap:7px}.sound-toggle{padding:8px 11px;font-size:.8rem}.live{max-width:180px;text-align:right;justify-content:flex-end}.hud{width:calc(100% - 20px);gap:4px}.hud div{min-width:0;flex:1;padding:9px 6px}.hud strong{font-size:1.12rem}.matheo{width:105px;height:105px}.reveal-word{font-size:clamp(3.5rem,18vw,7rem)}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Commandes audio */
.header-right{flex-wrap:wrap;justify-content:flex-end}
.sound-toggle{white-space:nowrap}
@media(max-width:700px){
  .header-right{gap:6px}
  .sound-toggle{padding:8px 10px;font-size:.76rem}
}

/* Mise à jour Petit Mathéo V7 */
.update-badge{justify-self:center;margin:0 auto 12px;padding:8px 16px;border:1px solid #ff3155;border-radius:999px;color:#fff;background:#b50026;font-weight:1000;letter-spacing:.16em;animation:updateBlink .7s steps(2,end) infinite;box-shadow:0 0 24px rgba(255,49,85,.65)}
@keyframes updateBlink{50%{opacity:.25;transform:scale(.94)}}
.intro{overflow:auto;align-content:start;padding-top:90px;padding-bottom:40px}
.intro h1{font-size:clamp(2.5rem,7vw,6.5rem);margin-bottom:14px}
.intro-lead{margin-bottom:18px!important}
.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-width:760px;margin:0 auto 18px}
.feature-grid span{padding:10px 12px;border:1px solid #262626;border-radius:12px;background:rgba(255,255,255,.035);color:#bbb;font-size:.88rem}
.player-name{display:grid;gap:8px;max-width:370px;width:100%;margin:0 auto 10px;text-align:left;color:#ddd;font-weight:800}
.player-name input{width:100%;border:1px solid #383838;border-radius:14px;background:#0b0b0b;color:#fff;padding:13px 15px;font:inherit;outline:none}.player-name input:focus{border-color:#fff}
.start-error{color:var(--red)!important;min-height:20px;margin:0 auto 8px!important;font-size:.9rem!important}
.leaderboard{max-width:520px;width:100%;margin:22px auto 0;border:1px solid #272727;border-radius:18px;padding:14px 18px;background:rgba(0,0,0,.45)}
.leaderboard h2,.leaderboard-dialog h2{margin:0 0 10px;font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase}
.leaderboard ol,.leaderboard-dialog ol{list-style:none;padding:0;margin:0;display:grid;gap:6px}.leaderboard li,.leaderboard-dialog li{display:flex;justify-content:space-between;gap:20px;padding:7px 8px;border-bottom:1px solid #1e1e1e;color:#bbb}.leaderboard li:last-child,.leaderboard-dialog li:last-child{border:0}.leaderboard li b,.leaderboard-dialog li b{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#1d1d1d;color:#fff;margin-right:7px}.leaderboard li strong,.leaderboard-dialog li strong{color:var(--green)}
.hud{align-items:stretch}.rank-button{border:1px solid #333;background:#111;color:#fff;border-radius:15px;padding:0 14px;font-weight:800;cursor:pointer}.rank-button:hover{border-color:#777}
.event-banner{position:fixed;z-index:26;top:92px;left:50%;transform:translate(-50%,-20px);padding:10px 18px;border-radius:999px;background:#fff;color:#000;font-weight:1000;letter-spacing:.08em;opacity:0;pointer-events:none;transition:.25s}.event-banner.show{opacity:1;transform:translate(-50%,0);animation:eventPulse .55s infinite alternate}@keyframes eventPulse{to{box-shadow:0 0 30px rgba(255,255,255,.6)}}
.spawn-timer{position:fixed;left:0;right:0;top:0;height:4px;z-index:40;background:#111}.spawn-timer span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),#fff,#ffcf58)}
.matheo.mini{width:clamp(52px,7vw,82px);height:clamp(52px,7vw,82px)}
.matheo.giant{width:clamp(180px,24vw,310px);height:clamp(180px,24vw,310px)}
.matheo.invisible{opacity:.075;filter:drop-shadow(0 0 3px rgba(255,255,255,.08))}.matheo.invisible:hover{opacity:.13}
.matheo.fake{background:radial-gradient(circle,#7a0018,#160006);box-shadow:0 0 30px rgba(255,40,70,.55)}.matheo.fake img{filter:hue-rotate(300deg) saturate(2.2) contrast(1.2)}.matheo.fake:before{content:'FAUX';position:absolute;z-index:2;top:-22px;left:50%;transform:translateX(-50%);color:var(--red);font-size:.68rem;font-weight:1000;letter-spacing:.16em}
.leaderboard-dialog{width:min(520px,92vw);border:1px solid #333;border-radius:20px;background:#080808;color:#fff;padding:24px;box-shadow:0 30px 100px #000}.leaderboard-dialog::backdrop{background:rgba(0,0,0,.8);backdrop-filter:blur(8px)}.dialog-close{position:absolute;right:12px;top:10px;width:38px;height:38px;border:0;border-radius:50%;background:#191919;color:#fff;font-size:1.5rem;cursor:pointer}
@media(max-width:650px){.intro{padding-top:82px}.feature-grid{grid-template-columns:1fr}.intro-board{max-height:210px;overflow:auto}.hud div{padding:8px 4px}.rank-button{padding:0 8px;font-size:.72rem}.event-banner{top:135px;max-width:90vw;text-align:center;font-size:.75rem}}


/* Menu visuel V8 */
.intro{
  overflow:auto;
  place-content:start center;
  padding-top:clamp(88px,11vh,125px);
  padding-bottom:40px;
}
.intro h1{font-size:clamp(2.55rem,7.5vw,6.7rem);margin-bottom:14px}
.intro-lead{margin-bottom:20px!important}
.feature-grid{
  width:min(930px,94vw);
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:0 auto 14px;
}
.feature-card{
  min-height:92px;
  padding:11px 13px;
  display:flex;
  align-items:center;
  gap:12px;
  text-align:left;
  border:1px solid #292929;
  border-radius:18px;
  background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.018));
  box-shadow:inset 0 1px rgba(255,255,255,.04);
}
.feature-card strong{display:block;font-size:.9rem;margin-bottom:4px}
.feature-card small{display:block;color:#8d8d8d;line-height:1.25;font-size:.74rem}
.feature-matheo{
  position:relative;
  flex:0 0 62px;
  width:62px;
  height:62px;
  border-radius:50%;
  display:block;
  overflow:hidden;
  background:radial-gradient(circle,#2b2b2b,#050505 70%);
  border:1px solid #383838;
}
.feature-matheo img{
  position:absolute;
  width:142%;
  height:142%;
  left:-21%;
  top:-12%;
  object-fit:contain;
}
.shiny-preview{
  background:conic-gradient(#ff3155,#ffb800,#fff14c,#35ff86,#22d7ff,#725cff,#ff46d7,#ff3155);
  box-shadow:0 0 15px rgba(124,92,255,.7);
  animation:previewRainbow 1.7s linear infinite;
}
.mini-preview{transform:scale(.75)}
.invisible-preview{opacity:.16}
.giant-preview img{transform:scale(1.25)}
.fake-preview{
  border-color:#ff334f;
  background:radial-gradient(circle,#6d0718,#150005 72%);
  box-shadow:0 0 18px rgba(255,35,66,.22);
}
.fake-preview::after{
  content:"×";
  position:absolute;
  right:1px;
  top:-5px;
  z-index:2;
  color:#fff;
  font-size:1.65rem;
  font-weight:1000;
  text-shadow:0 0 8px #ff2345;
}
.rule-strip{
  width:min(930px,94vw);
  margin:0 auto 18px;
  display:flex;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.rule-strip span{
  padding:7px 11px;
  border:1px solid #282828;
  border-radius:999px;
  color:#a9a9a9;
  background:rgba(0,0,0,.45);
  font-size:.72rem;
  font-weight:750;
}
.player-name{margin-top:0}
@keyframes previewRainbow{to{filter:hue-rotate(360deg)}}
@media(max-width:760px){
  .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .feature-card{min-height:79px;padding:8px;gap:8px}
  .feature-matheo{flex-basis:52px;width:52px;height:52px}
  .feature-card strong{font-size:.8rem}
  .feature-card small{font-size:.66rem}
}
@media(max-width:430px){
  .intro{padding:78px 12px 28px}
  .feature-grid{width:100%;grid-template-columns:1fr 1fr}
  .feature-card{min-height:74px}
  .feature-matheo{flex-basis:46px;width:46px;height:46px}
  .rule-strip{width:100%}
}


/* V9 : trois faux Mathéo = fin de partie */
.hud{
  grid-template-columns:repeat(4,minmax(90px,1fr)) auto;
}
#fakeStrikes{
  color:#ff5268;
}
.game-over{
  position:fixed;
  inset:0;
  z-index:90;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(0,0,0,.86);
  backdrop-filter:blur(14px);
}
.game-over.hidden{display:none}
.game-over-card{
  width:min(520px,92vw);
  padding:38px 28px;
  text-align:center;
  border:1px solid rgba(255,255,255,.18);
  border-radius:28px;
  background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025));
  box-shadow:0 30px 90px rgba(0,0,0,.65),0 0 70px rgba(255,35,70,.08);
}
.game-over-card h2{
  margin:4px 0 16px;
  font-size:clamp(2rem,7vw,4.5rem);
  line-height:.95;
  letter-spacing:-.05em;
  color:#ff3e5b;
}
.game-over-card p{
  color:#c7c7c7;
  font-size:1.05rem;
}
.game-over-card #finalScore{
  color:#fff;
  font-size:1.5rem;
}
.game-over-card button{
  margin-top:12px;
  border:0;
  border-radius:999px;
  padding:14px 24px;
  background:#fff;
  color:#000;
  font-weight:900;
  cursor:pointer;
}
@media(max-width:760px){
  .hud{grid-template-columns:repeat(2,1fr)}
  .rank-button{grid-column:1/-1}
}


/* V10 : interface plus propre, classement mobile et faux Mathéo variés */
body{
  background:
    radial-gradient(circle at 50% 32%,rgba(84,84,84,.16),transparent 28%),
    radial-gradient(circle at 12% 75%,rgba(38,255,132,.045),transparent 28%),
    radial-gradient(circle at 88% 65%,rgba(255,49,83,.045),transparent 26%),
    #020202;
}
.game-header{
  top:12px;
  left:12px;
  right:12px;
  padding:8px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:20px;
  background:rgba(5,5,5,.72);
  backdrop-filter:blur(18px);
  box-shadow:0 18px 50px rgba(0,0,0,.38);
}
.game-brand{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  gap:8px;
  color:#ddd;
  font-weight:850;
  letter-spacing:-.02em;
  pointer-events:none;
}
.game-brand img{
  width:34px;
  height:34px;
  border-radius:50%;
  object-fit:cover;
  background:#111;
}
.back,.sound-toggle{
  min-height:40px;
  border-color:rgba(255,255,255,.1);
  background:rgba(255,255,255,.035);
}
.sound-toggle{
  width:43px;
  padding:8px;
  font-size:0;
}
.sound-toggle::first-letter{font-size:1rem}
.header-right{gap:7px}
.live{
  padding:9px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.035);
  font-size:.78rem;
}
.hud{
  width:min(720px,calc(100% - 24px));
  border-color:rgba(255,255,255,.1);
  background:rgba(5,5,5,.78);
  box-shadow:0 22px 70px rgba(0,0,0,.55);
}
.hud div{
  background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.018));
}
.rank-button{
  min-width:118px;
  background:linear-gradient(145deg,#191919,#0b0b0b);
}
.spawn-timer{
  height:3px;
  background:rgba(255,255,255,.08);
}
.spawn-timer span{
  box-shadow:0 0 10px var(--green);
}

/* Faux Mathéo dans plusieurs tailles */
.matheo.fake-small{
  width:clamp(54px,7vw,88px);
  height:clamp(54px,7vw,88px);
}
.matheo.fake-medium{
  width:clamp(100px,14vw,185px);
  height:clamp(100px,14vw,185px);
}
.matheo.fake-large{
  width:clamp(180px,25vw,330px);
  height:clamp(180px,25vw,330px);
}
.matheo.fake-wide{
  width:clamp(145px,20vw,270px);
  height:clamp(82px,11vw,145px);
  border-radius:42%;
}
.matheo.fake-wide img{
  width:125%;
  height:165%;
  left:-12%;
  top:-30%;
}

/* Classement plus lisible */
.leaderboard-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}
.leaderboard-heading p{
  margin:0 0 4px;
  color:#777;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.68rem;
  font-weight:800;
}
.leaderboard-heading h2{margin:0}
.leaderboard-heading > span{
  padding:7px 10px;
  border:1px solid #303030;
  border-radius:999px;
  color:#999;
  font-size:.7rem;
  font-weight:800;
}
.leaderboard-dialog ol{
  counter-reset:rank;
  max-height:min(62vh,520px);
  overflow:auto;
  padding-right:4px;
}
.leaderboard-dialog li{
  min-height:52px;
  align-items:center;
  padding:10px 12px;
  border:1px solid transparent;
  border-bottom-color:#202020;
  border-radius:12px;
  font-size:1rem;
}
.leaderboard-dialog li:nth-child(1){
  background:linear-gradient(90deg,rgba(255,209,64,.12),transparent);
  border-color:rgba(255,209,64,.18);
}
.leaderboard-dialog li:nth-child(2){
  background:linear-gradient(90deg,rgba(210,220,230,.09),transparent);
}
.leaderboard-dialog li:nth-child(3){
  background:linear-gradient(90deg,rgba(205,127,50,.09),transparent);
}
.leaderboard-dialog li span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.leaderboard-dialog li strong{
  flex:0 0 auto;
  min-width:54px;
  text-align:right;
  font-size:1.12rem;
}
.dialog-close{
  z-index:3;
  width:44px;
  height:44px;
}

/* Mobile */
@media(max-width:650px){
  .game-header{
    top:7px;
    left:7px;
    right:7px;
    min-height:54px;
  }
  .game-brand span{display:none}
  .game-brand img{width:38px;height:38px}
  .back{padding:8px 11px;font-size:.78rem}
  .header-right{
    flex-direction:row;
    align-items:center;
    gap:5px;
  }
  .sound-toggle{
    width:38px;
    min-height:38px;
  }
  .live{
    position:fixed;
    top:69px;
    left:50%;
    transform:translateX(-50%);
    width:max-content;
    max-width:calc(100vw - 20px);
    justify-content:center;
    font-size:.7rem;
    background:rgba(5,5,5,.8);
    border:1px solid rgba(255,255,255,.08);
  }
  .hud{
    bottom:max(8px,env(safe-area-inset-bottom));
    width:calc(100% - 14px);
    padding:6px;
    gap:5px;
    border-radius:18px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
  }
  .hud div{
    min-width:0;
    padding:8px 3px;
    border-radius:12px;
  }
  .hud span{
    font-size:.5rem;
    letter-spacing:.08em;
  }
  .hud strong{font-size:1.05rem}
  .rank-button{
    grid-column:1/-1;
    min-height:38px;
    padding:8px;
  }
  .leaderboard-dialog{
    position:fixed;
    inset:auto 0 0 0;
    width:100%;
    max-width:none;
    max-height:88svh;
    margin:0;
    padding:25px 16px max(22px,env(safe-area-inset-bottom));
    border-radius:26px 26px 0 0;
    border-left:0;
    border-right:0;
    border-bottom:0;
  }
  .leaderboard-dialog::before{
    content:"";
    display:block;
    width:44px;
    height:4px;
    margin:-12px auto 18px;
    border-radius:999px;
    background:#373737;
  }
  .leaderboard-dialog ol{
    max-height:62svh;
  }
  .leaderboard-dialog li{
    min-height:55px;
    font-size:.98rem;
    padding:10px 8px;
  }
  .leaderboard-dialog li b{
    width:30px;
    height:30px;
    margin-right:8px;
  }
  .leaderboard-dialog li strong{
    min-width:48px;
  }
  .intro-board{
    max-height:260px;
    width:100%;
  }
  .intro-board li{
    min-height:42px;
    font-size:.88rem;
  }
}


/* V11 : correction réelle de l'affichage mobile */
@media(max-width:650px){
  /* Le compteur en direct reste dans l'en-tête et ne recouvre plus les cartes */
  .live{
    position:static!important;
    transform:none!important;
    width:auto!important;
    max-width:none!important;
    padding:7px 9px!important;
    font-size:0!important;
    white-space:nowrap;
  }
  .live strong{
    font-size:.72rem;
  }
  .live::after{
    content:" clics";
    margin-left:3px;
    color:#aaa;
    font-size:.62rem;
  }

  .game-header{
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
  }
  .game-brand{
    position:static;
    transform:none;
    justify-self:center;
  }
  .header-right{
    justify-self:end;
  }

  /* L'accueil ne passe plus sous l'en-tête */
  .intro{
    padding-top:88px!important;
  }

  /* Les records visibles sur l'accueil sont limités au top 3 et tiennent sur un écran */
  .leaderboard.intro-board{
    width:100%;
    max-width:none;
    max-height:none!important;
    overflow:visible!important;
    margin-top:18px;
    padding:10px;
  }
  .leaderboard.intro-board h2{
    margin-bottom:9px;
    font-size:.85rem;
  }
  .leaderboard.intro-board ol{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
  }
  .leaderboard.intro-board li{
    min-width:0;
    min-height:82px;
    padding:8px 5px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:5px;
    text-align:center;
    border:1px solid #252525;
    border-radius:13px;
    background:rgba(255,255,255,.025);
  }
  .leaderboard.intro-board li span{
    width:100%;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.72rem;
  }
  .leaderboard.intro-board li b{
    display:grid;
    width:25px;
    height:25px;
    margin:0 auto 5px;
  }
  .leaderboard.intro-board li strong{
    min-width:0;
    font-size:.8rem;
    white-space:nowrap;
  }
  .leaderboard.intro-board li:nth-child(1){
    border-color:rgba(255,210,70,.3);
    background:linear-gradient(145deg,rgba(255,210,70,.09),rgba(255,255,255,.018));
  }
  .leaderboard.intro-board li:nth-child(2){
    border-color:rgba(220,230,240,.2);
  }
  .leaderboard.intro-board li:nth-child(3){
    border-color:rgba(205,127,50,.22);
  }

  /* Fenêtre du classement complet */
  .leaderboard-dialog{
    max-height:92svh;
  }
  .leaderboard-dialog ol{
    max-height:68svh;
  }
  .leaderboard-dialog li{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
  }
  .leaderboard-dialog li span{
    display:flex;
    align-items:center;
  }
}

@media(max-width:390px){
  .game-header{
    grid-template-columns:auto 34px auto;
  }
  .back{
    padding:8px 9px;
    font-size:.7rem;
  }
  .header-right{
    gap:3px;
  }
  .sound-toggle{
    width:34px;
    min-height:34px;
  }
  .live{
    padding:6px 7px!important;
  }
  .leaderboard.intro-board li{
    min-height:76px;
  }
  .leaderboard.intro-board li span{
    font-size:.66rem;
  }
  .leaderboard.intro-board li strong{
    font-size:.72rem;
  }
}
