/* r18 (14/11/2026, pedido do dono) — partida valendo: barra de meta nova no HUD e telas de fim (vitória e derrota) refeitas.
   O HUD e o resultado são do JSX novo da engine (classes mt18-*; ver _turbo7/scripts/r18/partida/r18_hud_resultado.js).
   A barra de meta é UMA só peça (.mt18-barra), igual no HUD e no resumo final: o que a pessoa vê correndo é o que vê no fim.
   O treino (mr-tutorial.*) tem HUD próprio (.mrt2-rhud) e não usa nada daqui.
   Toda regra começa com body para vencer o CSS da engine, que entra depois. Tokens --mt-* de mr-visual.css. */

/* ================= barra de meta (HUD e resultado) ================= */
body .mt18-barra{--mt18-alt:26px;position:relative;height:var(--mt18-alt);min-width:0}
body .mt18-barra__trilho{position:absolute;inset:0;overflow:hidden;border-radius:999px;background:
  linear-gradient(90deg,transparent calc(25% - 1px),rgba(127,232,255,.16) 25%,transparent calc(25% + 1px),
  transparent calc(50% - 1px),rgba(127,232,255,.16) 50%,transparent calc(50% + 1px),
  transparent calc(75% - 1px),rgba(127,232,255,.16) 75%,transparent calc(75% + 1px)),rgba(1,12,30,.82);
  box-shadow:inset 0 2px 3px rgba(0,0,0,.55),inset 0 0 0 1px rgba(127,232,255,.24)}
body .mt18-barra__fill{position:absolute;left:0;top:0;bottom:0;width:var(--mt18-p);border-radius:inherit;
  background:repeating-linear-gradient(-45deg,rgba(255,255,255,.22) 0 6px,transparent 6px 13px),linear-gradient(180deg,#fff27a,#ffd21f 55%,#f0a10f);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(160,90,0,.35),0 0 12px rgba(255,216,58,.5)}
/* banana que "corre" na ponta do preenchimento */
body .mt18-barra__ban{position:absolute;z-index:2;top:50%;left:clamp(12px,var(--mt18-p),calc(100% - 40px));width:30px;height:30px;
  translate:-50% -50%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 2px 0 rgba(90,50,0,.6)) drop-shadow(0 0 6px rgba(255,216,58,.6));
}
/* desempenho (r18): sem transição na barra do HUD — com 7,5 atualizações por segundo a transição ficava sempre ativa e
   repintava o cartão (com desfoque de fundo) a cada quadro. Só o resultado anima o preenchimento, uma vez. */
body .mt18-r .mt18-barra__fill{transition:width .35s cubic-bezier(.3,.9,.4,1)}
body .mt18-r .mt18-barra__ban{transition:left .35s cubic-bezier(.3,.9,.4,1)}
/* valor / alvo dentro da barra (como no Candy) */
body .mt18-barra__txt{position:absolute;z-index:3;left:50%;top:50%;translate:-50% -50%;display:flex;align-items:center;padding:3px 10px 4px;
  border-radius:999px;background:rgba(3,20,48,.8);box-shadow:inset 0 0 0 1px rgba(127,232,255,.28);
  font:400 14px/1 var(--mt-titulo);letter-spacing:.02em;color:#fff;white-space:nowrap;text-shadow:0 1px 0 #04183c}
body .mt18-barra__txt small{font:inherit;color:#bfe9ff;margin:0 4px}
/* bandeira quadriculada no fim = a meta */
body .mt18-barra__fim{position:absolute;z-index:2;right:4px;top:50%;width:18px;height:18px;translate:0 -50%;border-radius:5px;
  background:conic-gradient(#fff 0 25%,#13213d 0 50%,#fff 0 75%,#13213d 0) 0 0/9px 9px;box-shadow:0 0 0 2px #04183c,0 0 0 3px rgba(255,216,58,.9)}
/* meta batida: verde do prêmio, banana na chegada */
body .mt18-barra--ok .mt18-barra__fill{background:repeating-linear-gradient(-45deg,rgba(255,255,255,.22) 0 6px,transparent 6px 13px),linear-gradient(180deg,#a8ffbf,#46ef7b 58%,#1fbf5a);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -2px 0 rgba(0,90,40,.35),0 0 14px rgba(84,242,141,.55)}
body .mt18-barra--ok .mt18-barra__fim{box-shadow:0 0 0 2px #04183c,0 0 0 3px #5cf597,0 0 12px rgba(92,245,151,.8)}
/* derrota: até onde chegou, em coral */
body .mt18-barra--perdeu .mt18-barra__fill{background:repeating-linear-gradient(-45deg,rgba(255,255,255,.16) 0 6px,transparent 6px 13px),linear-gradient(180deg,#ffb59a,#ff7a6b 60%,#d94a55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 10px rgba(255,100,116,.4)}
body .mt18-barra--perdeu .mt18-barra__ban{filter:grayscale(.55) brightness(.9) drop-shadow(0 2px 0 rgba(60,20,20,.6))}

/* texto só para leitor de tela */
body .mt18-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ================= HUD da corrida ================= */
body .mt18-hud{position:absolute;z-index:3;top:max(10px,env(safe-area-inset-top,0px));left:10px;right:10px;max-width:520px;margin-inline:auto;
  display:grid;gap:9px;padding:10px 12px 12px;border-radius:20px;border:1px solid rgba(127,232,255,.42);pointer-events:none;
  background:linear-gradient(180deg,rgba(14,60,112,.9),rgba(3,22,50,.93));font-family:var(--mt-texto);color:#fff;
  box-shadow:inset 0 1px 0 rgba(190,236,255,.24),inset 0 -1px 0 rgba(0,0,0,.35),0 10px 26px rgba(0,8,30,.45);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:opacity .22s ease,transform .22s ease}
body .mt18-hud--abrindo{opacity:0;transform:translateY(-10px)}
body .mt18-hud__linha{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px}
/* chips: bananas (amarelo) e distância (ciano) */
body .mt18-hud__chip{display:flex;align-items:center;gap:6px;min-width:0;padding:3px 10px 3px 5px;border-radius:999px;justify-self:start}
body .mt18-hud__chip span{display:grid;line-height:1;min-width:0}
body .mt18-hud__chip strong{font:400 24px/1 var(--mt-titulo);letter-spacing:.01em;white-space:nowrap}
body .mt18-hud__chip small{margin-top:2px;font:800 10px/1.1 var(--mt-texto);white-space:nowrap}
body .mt18-hud__chip--ban{border:1px solid rgba(255,216,58,.6);background:linear-gradient(180deg,rgba(255,216,58,.2),rgba(255,216,58,.06))}
body .mt18-hud__chip--ban img{width:30px;height:30px;object-fit:contain;flex:none}
body .mt18-hud__chip--ban strong{color:#ffe238;text-shadow:0 2px 0 #7c5815}
body .mt18-hud__chip--ban small{color:#ffeaa0}
body .mt18-hud__chip--dist{justify-self:end;padding:3px 10px 3px 8px;border:1px solid rgba(127,232,255,.5);background:linear-gradient(180deg,rgba(63,220,255,.18),rgba(63,220,255,.05))}
body .mt18-hud__chip--dist svg{width:18px;height:18px;flex:none;color:var(--mt-ciano-2);stroke-width:2.5}
body .mt18-hud__chip--dist strong{color:#fff;text-shadow:0 2px 0 #04366b;font-variant-numeric:tabular-nums}
body .mt18-hud__chip--dist strong i{font-style:normal;font-size:15px;color:var(--mt-ciano-2)}
body .mt18-hud__chip--dist small{color:var(--mt-ciano-2)}
/* acumulado no centro */
body .mt18-hud__acum{position:relative;display:grid;justify-items:center;line-height:1}
body .mt18-hud__acum small{font:900 10px/1 var(--mt-texto);letter-spacing:.08em;color:var(--mt-ciano-2)}
body .mt18-hud__acum strong{margin-top:3px;font:400 clamp(26px,7.4vw,32px)/1 var(--mt-titulo);letter-spacing:.01em;color:#5cf597;white-space:nowrap;
  text-shadow:0 2px 0 #0b5b2c,0 0 14px rgba(84,242,141,.35)}
body .mt18-hud__acum strong.is-pulso{animation:mt18-pulso .42s ease-out}
@keyframes mt18-pulso{35%{transform:scale(1.07)}}
body .mt18-hud__ganho{position:absolute;left:50%;top:-4px;translate:-50% 0;padding:2px 7px;border-radius:999px;background:#16b84a;color:#fff;font:900 11px/1.3 var(--mt-texto);
  font-style:normal;white-space:nowrap;box-shadow:0 2px 0 #0b7a2e,0 4px 10px rgba(0,30,10,.35);animation:mt18-ganho .9s ease-out forwards}
@keyframes mt18-ganho{0%{opacity:0;transform:translateY(5px)}15%,65%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-8px)}}
/* linha da meta */
body .mt18-hud__meta{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px}
body .mt18-hud__meta-rot{font:900 11px/1 var(--mt-texto);color:var(--mt-amarelo);white-space:nowrap}
body .mt18-hud--meta .mt18-hud__meta-rot{color:#5cf597}
body .mt18-hud--meta{border-color:rgba(92,245,151,.6);box-shadow:inset 0 1px 0 rgba(190,236,255,.24),0 0 0 3px rgba(92,245,151,.14),0 10px 26px rgba(0,8,30,.45)}
@media (max-width:370px){
  body .mt18-hud__chip strong{font-size:20px}
  body .mt18-hud__chip small{font-size:9px}
  body .mt18-hud__chip--ban img{width:24px;height:24px}
  body .mt18-hud__acum strong{font-size:24px}
  body .mt18-barra__txt{font-size:12.5px}
}
/* botão de som logo abaixo do HUD, à direita */
body:has(.mt18-hud) .mr-som-jogo{left:auto;right:14px;bottom:auto;transform:none;top:calc(max(10px,env(safe-area-inset-top,0px)) + 112px)}
@media (min-width:560px){body:has(.mt18-hud) .mr-som-jogo{right:calc(50% - 256px)}}

/* ================= resultado (vitória e derrota) ================= */
body .mr-demo__result-card:has(.mt18-r){width:min(100%,500px);padding:18px 18px 16px}
body .mt18-r{display:grid;text-align:center;font-family:var(--mt-texto);color:#e5f5ff}
body .mt18-r__topo{position:relative;isolation:isolate;display:grid;justify-items:center;padding-top:4px}
body .mt18-r__selo{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font:900 12px/1 var(--mt-texto);letter-spacing:.1em;text-transform:uppercase}
body .mt18-r__selo svg{width:15px;height:15px}
body .mt18-r--won .mt18-r__selo{color:#b9ffd6;border:1px solid rgba(92,245,151,.6);background:linear-gradient(180deg,rgba(14,92,72,.8),rgba(3,40,42,.9))}
body .mt18-r--lost .mt18-r__selo{color:#ffc5c1;border:1px solid #ff6474;background:linear-gradient(120deg,#602c3a,#361b2b)}
body .mt18-r__titulo{margin:10px 0 0;font:400 clamp(30px,8.6vw,38px)/1 var(--mt-titulo)!important;letter-spacing:.01em;color:#fff;
  text-shadow:0 2px 0 #d9f2ff,0 4px 0 #6fbce9,0 6px 0 #22628b,0 9px 8px rgba(0,0,0,.55)}
body .mt18-r__titulo:focus{outline:none}
/* o prêmio é o centro da vitória */
body .mt18-r__premio{position:relative;margin:8px 0 2px;font:400 clamp(54px,16vw,76px)/1 var(--mt-titulo);letter-spacing:.01em;color:#5cf597;white-space:nowrap;
  font-variant-numeric:tabular-nums;text-shadow:0 3px 0 #0b8a3e,0 6px 0 #064a22,0 10px 14px rgba(0,0,0,.5),0 0 34px rgba(84,242,141,.45)}
body .mt18-r--won .mt18-r__topo::before{content:"";position:absolute;z-index:-1;left:50%;top:44%;width:340px;height:340px;translate:-50% -50%;border-radius:50%;
  pointer-events:none;background:repeating-conic-gradient(from 0deg,rgba(255,226,110,.16) 0 9deg,transparent 9deg 22deg);
  -webkit-mask:radial-gradient(circle,#000 14%,transparent 66%);mask:radial-gradient(circle,#000 14%,transparent 66%);animation:mt18-raios 40s linear infinite}
@keyframes mt18-raios{to{rotate:360deg}}
body .mt18-r__sub{margin:6px 0 0;font:800 14px/1.35 var(--mt-texto);color:#d9fbe9;text-wrap:balance}
body .mt18-r--lost .mt18-r__sub{margin-top:12px;color:#ffd6cf}
/* chuva curta de bananas na vitória (uma vez) */
body .mt18-r__chuva{position:absolute;z-index:-1;inset:-18px -18px auto;height:220px;overflow:hidden;pointer-events:none}
body .mt18-r__chuva img{position:absolute;top:-40px;width:28px;height:28px;opacity:0;animation:mt18-chuva 1.7s cubic-bezier(.35,.1,.6,1) forwards}
body .mt18-r__chuva img:nth-child(1){left:6%;animation-delay:.05s}
body .mt18-r__chuva img:nth-child(2){left:18%;animation-delay:.35s;width:22px}
body .mt18-r__chuva img:nth-child(3){left:29%;animation-delay:.15s}
body .mt18-r__chuva img:nth-child(4){left:40%;animation-delay:.5s;width:20px}
body .mt18-r__chuva img:nth-child(5){left:52%;animation-delay:.1s}
body .mt18-r__chuva img:nth-child(6){left:63%;animation-delay:.42s;width:24px}
body .mt18-r__chuva img:nth-child(7){left:73%;animation-delay:.22s}
body .mt18-r__chuva img:nth-child(8){left:83%;animation-delay:.6s;width:20px}
body .mt18-r__chuva img:nth-child(9){left:91%;animation-delay:.28s}
body .mt18-r__chuva img:nth-child(10){left:12%;animation-delay:.7s;width:18px}
@keyframes mt18-chuva{0%{opacity:0;transform:translateY(0) rotate(-20deg)}12%{opacity:1}80%{opacity:.9}100%{opacity:0;transform:translateY(250px) rotate(40deg)}}
/* derrota: o medalhão da caveira (o mesmo de antes), menor; título coral */
body .mt18-r__emblema{position:relative;width:208px;height:208px;margin:-34px auto -40px;padding:0;transform:scale(.64);isolation:isolate}
body .mt18-r--lost .mt18-r__selo{order:-1;margin-bottom:2px}
body .mt18-r--lost .mt18-r__titulo{margin-top:6px;font-size:clamp(36px,10.6vw,50px)!important;color:#ff9775;transform:rotate(-2deg);
  text-shadow:0 2px 0 #f66756,0 5px 0 #c33d3d,0 8px 0 #651d2b,0 11px 8px rgba(0,0,0,.5)}
/* meta: mesma barra do HUD */
body .mt18-r__meta{display:grid;gap:9px;margin-top:16px;padding:12px 14px 14px;border-radius:16px;border:1px solid rgba(127,232,255,.22);
  background:linear-gradient(180deg,rgba(12,52,100,.62),rgba(2,18,42,.72));box-shadow:inset 0 1px 0 rgba(190,236,255,.1);text-align:left}
body .mt18-r__meta-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
body .mt18-r__meta-top strong{font:900 13px/1.25 var(--mt-texto);color:#fff}
body .mt18-r__meta-top span{flex:none;font:900 12px/1.25 var(--mt-texto);color:var(--mt-amarelo);white-space:nowrap}
body .mt18-r--won .mt18-r__meta{border-color:rgba(92,245,151,.45)}
body .mt18-r--won .mt18-r__meta-top strong{color:#b9ffd6}
body .mt18-r--lost .mt18-r__meta-top strong{color:#ffc5c1}
body .mt18-r__meta .mt18-barra{--mt18-alt:28px}
/* bananas, distância e aposta: as mesmas peças do HUD */
body .mt18-r__dados{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0 0;padding:0;list-style:none}
body .mt18-r__dados li{display:grid;justify-items:center;align-content:center;gap:3px;min-width:0;padding:10px 4px 9px;border-radius:14px;
  border:1px solid rgba(127,232,255,.22);background:linear-gradient(180deg,rgba(12,52,100,.55),rgba(2,18,42,.7))}
body .mt18-r__dados img{width:28px;height:28px;object-fit:contain}
body .mt18-r__dados svg{width:24px;height:24px;color:var(--mt-ciano-2);stroke-width:2.3}
body .mt18-r__dados strong{font:400 clamp(19px,5.6vw,24px)/1.05 var(--mt-titulo)!important;letter-spacing:.01em;color:#fff;white-space:nowrap;font-variant-numeric:tabular-nums}
body .mt18-r__dados li:first-child strong{color:#ffe238;text-shadow:0 2px 0 #7c5815}
body .mt18-r__dados strong small{font-size:.66em;color:var(--mt-ciano-2)}
body .mt18-r__dados span{font:800 11px/1.15 var(--mt-texto);color:#8fcaf0;white-space:nowrap}
body .mt18-r__dados li.is-perdida{border-color:rgba(255,120,130,.45);background:linear-gradient(180deg,rgba(110,36,56,.45),rgba(40,18,36,.7))}
body .mt18-r__dados li.is-perdida svg,body .mt18-r__dados li.is-perdida span{color:#ffb5a4}
body .mt18-r__dados li.is-perdida strong{color:#ffd6cf}
body .mt18-r__aviso{margin:10px 0 0;font:700 12.5px/1.4 var(--mt-texto);color:#c3d9f0;text-wrap:balance}
/* saldo: linha de extrato */
body .mt18-r__saldo{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;margin-top:10px;padding:10px 14px;border-radius:14px;
  border:1px solid rgba(127,232,255,.18);background:rgba(2,18,42,.55);text-align:left}
body .mt18-r__saldo svg{width:18px;height:18px;color:var(--mt-ciano-2)}
body .mt18-r__saldo span{font:800 12px/1.2 var(--mt-texto);color:#8fcaf0}
body .mt18-r__saldo strong{font:400 20px/1 var(--mt-titulo);letter-spacing:.01em;color:#fff;white-space:nowrap}
/* botões: os mesmos do jogo (dourado e vidro); só o espaço muda */
body .mt18-r .mr-demo__play-again{margin:16px 0 10px;min-height:58px}
body .mt18-r .mr-demo__box-win{margin:14px 0 0;text-align:left}
@media (max-width:600px){
  body .mr-demo__result-card:has(.mt18-r){padding:16px 14px 14px}
  body .mt18-r__emblema{width:146px;height:146px;margin:-14px auto -18px;transform:scale(.82)}
}
/* computador baixo (1366×768): tudo, até os secundários, na primeira tela */
@media (min-width:601px) and (max-height:820px){
  body .mr-demo__overlay--result:has(.mt18-r){padding-top:max(16px,env(safe-area-inset-top,0px));padding-bottom:12px}
  body .mr-demo__result-card:has(.mt18-r){padding:14px 22px 14px}
  body .mt18-r__premio{font-size:62px;margin-top:4px}
  body .mt18-r__titulo{margin-top:8px}
  body .mt18-r__meta{margin-top:12px;padding:10px 14px 12px}
  body .mt18-r__dados li{padding:8px 4px 7px}
  body .mt18-r .mr-demo__play-again{margin:12px 0 8px;min-height:54px}
  body .mt18-r .mr-demo__secondary{min-height:44px}
  body .mt18-r__emblema{margin:-44px auto -52px;transform:scale(.56)}
}

/* movimento reduzido: sem chuva, raios, pulso e "+R$" animados */
@media (prefers-reduced-motion:reduce){
  body .mt18-r__chuva{display:none}
  body .mt18-r--won .mt18-r__topo::before,body .mt18-hud__acum strong.is-pulso{animation:none}
  body .mt18-hud__ganho{animation:none;opacity:1}
  body .mt18-barra__fill,body .mt18-barra__ban,body .mt18-hud{transition:none}
}

/* r19: coleta no próprio Minion — "+R$" sobe da banana e a banana voa até o contador (mr-site.js, evento mr:banana) */
.mr19-coleta{position:fixed;z-index:60;pointer-events:none;translate:28px -150%;animation:mr19-sobe .7s ease-out forwards}  /* r19b: ao lado e acima da cabeça, sem cobrir o Minion */
.mr19-coleta b{display:block;padding:2px 8px;border-radius:999px;background:#16b84a;color:#fff;font:900 12px/1.25 var(--mt-texto,Nunito,sans-serif);
  white-space:nowrap;box-shadow:0 2px 0 #0b7a2e,0 6px 14px rgba(0,30,10,.4);text-shadow:0 1px 0 rgba(0,0,0,.25)}
@keyframes mr19-sobe{0%{opacity:0;transform:translateY(6px) scale(.7)}18%{opacity:1;transform:translateY(-6px) scale(1.08)}70%{opacity:1;transform:translateY(-34px) scale(1)}100%{opacity:0;transform:translateY(-48px) scale(.95)}}
.mr19-voo{position:fixed;z-index:59;width:30px;height:30px;margin:-15px 0 0 -15px;pointer-events:none;object-fit:contain;
  filter:drop-shadow(0 3px 4px rgba(80,40,0,.45));animation:mr19-voa .6s cubic-bezier(.45,0,.2,1) forwards}
@keyframes mr19-voa{0%{transform:translate(0,0) scale(.6);opacity:0}15%{transform:translate(0,-14px) scale(1.15);opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(.55);opacity:.9}}
@media (prefers-reduced-motion:reduce){.mr19-coleta{animation-duration:.6s}}