:root{

  /* superfícies — 3 níveis de profundidade */

  --navy:#07101F;--navy-2:#0E1B33;--navy-3:#13233F;--navy-4:#1B2E6B;--sunken:#0A1730;--radio:#060E1C;

  /* texto */

  --white:#EEF2FB;--txt-2:#C2CEE6;--sil:#9AA6C4;--txt-3:#6F7DA0;

  /* acentos */

  --accent:#10b981;--al:#34d399;--ok-l:#4ADE80;

  --tac:#3b82f6;--tac-l:#60a5fa;--tac-d:#1E3A8A;

  --gold:#F2B541;--gold-l:#FCD34D;--gold-d:#B97309;

  --ok:#22c55e;--err:#ef4444;--err-l:#F87171;--warn:#f59e0b;

  /* bordas e brilho de topo */

  --bd:rgba(120,150,210,.14);--bd-strong:rgba(120,150,210,.20);--bd-tac:rgba(59,130,246,.45);--top-light:rgba(150,180,240,.10);

  /* raios e sombras */

  --r-xs:8px;--r-sm:12px;--r-md:14px;--r-lg:18px;

  --sh-1:0 2px 8px rgba(0,0,0,.35);--sh-2:0 12px 32px rgba(0,0,0,.45);--sh-3:0 18px 52px rgba(2,6,16,.62);

  --fh:'Montserrat',sans-serif;--fb:'Open Sans',sans-serif;

}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html{background:var(--navy);overflow-x:hidden;overscroll-behavior:none}

body{font-family:var(--fb);background:var(--navy);color:var(--white);min-height:100vh;display:flex;flex-direction:column;align-items:center;overflow-x:hidden;overscroll-behavior:none}

body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;

  background:radial-gradient(ellipse 60% 50% at 50% -10%, rgba(59,130,246,.12), transparent 60%),

   repeating-linear-gradient(0deg,transparent 0 40px,rgba(59,130,246,.02) 40px 41px),

   repeating-linear-gradient(90deg,transparent 0 40px,rgba(59,130,246,.02) 40px 41px)}

.topbar,.wrap{position:relative;z-index:1}

.topbar{width:100%;background:rgba(10,22,40,.97);border-bottom:1px solid rgba(59,130,246,.18);padding:0 20px;padding-left:max(20px,env(safe-area-inset-left,0));padding-right:max(20px,env(safe-area-inset-right,0));height:52px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;padding-top:env(safe-area-inset-top,0)}

.topbar__left{display:flex;align-items:center;gap:10px}

.topbar__logo{font-family:var(--fh);font-size:14px;font-weight:800;letter-spacing:1px}

.topbar__logo span{color:var(--al)}

.topbar__tag{background:rgba(59,130,246,.16);border:1px solid rgba(59,130,246,.3);border-radius:20px;padding:3px 10px;font-size:11px;font-weight:700;color:var(--tac-l)}

.btn-back{padding:6px 12px;border-radius:8px;font-size:12px;font-weight:600;background:transparent;color:var(--sil);border:1px solid rgba(255,255,255,.12);cursor:pointer;transition:.2s;text-decoration:none;display:inline-flex;align-items:center;white-space:nowrap}

.btn-back:hover{color:var(--white)}

.wrap{width:100%;max-width:660px;padding:24px 16px 60px;padding-left:max(16px,env(safe-area-inset-left,0));padding-right:max(16px,env(safe-area-inset-right,0));flex:1}
@media(max-width:420px){
  .topbar{padding-left:max(12px,env(safe-area-inset-left,0));padding-right:max(12px,env(safe-area-inset-right,0));gap:6px}
  .topbar__tag{display:none}
  .topbar__left{gap:6px;min-width:0}
  .topbar__logo{font-size:13px}
  .btn-back{padding:6px 8px;font-size:11px}
}



/* ── Lobby ── */

.lobby{background:var(--navy-2);border:1px solid rgba(59,130,246,.18);border-radius:20px;padding:36px 28px;text-align:center}

.brasao{width:96px;height:96px;margin:0 auto 14px;display:block;filter:drop-shadow(0 4px 16px rgba(245,158,11,.35));animation:floaty 3.6s ease-in-out infinite}

@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

.lobby__title{font-family:var(--fh);font-size:27px;font-weight:900;margin-bottom:6px;letter-spacing:.5px}

.lobby__title b{color:var(--gold-l)}

.lobby__sub{color:var(--sil);font-size:14.5px;margin-bottom:24px;line-height:1.6}

.lobby__rules{background:var(--navy-3);border-radius:12px;padding:16px 20px;text-align:left;margin-bottom:22px}

.lobby__rules h3{font-family:var(--fh);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--tac-l);margin-bottom:10px}

.rule-item{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--sil);margin-bottom:7px;line-height:1.45}

.rule-item b{color:#cdd7ee}

.diff-row{display:flex;gap:8px;justify-content:center;margin-bottom:8px;flex-wrap:wrap}

.diff-btn{padding:10px 16px;border-radius:8px;font-family:var(--fh);font-size:12px;font-weight:700;border:1px solid rgba(255,255,255,.12);background:var(--navy-3);color:var(--sil);cursor:pointer;transition:.2s;line-height:1.3;text-align:center}

.diff-btn.active{border-color:var(--tac);background:rgba(59,130,246,.2);color:var(--white)}

.diff-mult{font-size:10px;opacity:.75;display:block;margin-top:2px}

.lobby__input{width:100%;max-width:320px;padding:13px 16px;border-radius:10px;background:var(--navy-3);border:1px solid rgba(59,130,246,.25);color:var(--white);font-size:15px;outline:none;text-align:center;margin:14px auto 4px;transition:.2s;display:block}

.lobby__input:focus{border-color:var(--tac)}

.lobby__input::placeholder{color:rgba(255,255,255,.2)}

.btn-start{display:inline-flex;align-items:center;gap:8px;padding:15px 36px;border-radius:12px;font-family:var(--fh);font-weight:900;font-size:16px;background:linear-gradient(135deg,#1e3a8a,var(--tac));color:var(--white);border:none;cursor:pointer;transition:.2s;box-shadow:0 4px 20px rgba(59,130,246,.4);margin-top:16px}

.btn-start:hover{filter:brightness(1.12);transform:translateY(-2px)}



/* ── Cena / SVG ── */

.cena-wrap{border-radius:14px;overflow:hidden;border:1px solid rgba(59,130,246,.2);background:#070d18;line-height:0}

.cena-wrap svg{width:100%;height:auto;display:block;touch-action:manipulation}

@keyframes giroR{0%,49%{opacity:1}50%,100%{opacity:.18}}

@keyframes giroB{0%,49%{opacity:.18}50%,100%{opacity:1}}

.giro-r{animation:giroR .7s steps(1) infinite;transform-box:fill-box;transform-origin:center}

.giro-b{animation:giroB .7s steps(1) infinite;transform-box:fill-box;transform-origin:center}

.win-lit{animation:winFlick 4s ease-in-out infinite}

@keyframes winFlick{0%,100%{opacity:1}92%{opacity:1}94%{opacity:.45}96%{opacity:1}}

/* glow do giroflex: pulso SUAVE (a barra dura fica em steps(1); a luz ambiente cresce/decai) */

.giro-glow-r{animation:gGlowR .7s ease-out infinite;transform-box:fill-box;transform-origin:center}

.giro-glow-b{animation:gGlowB .7s ease-out infinite;transform-box:fill-box;transform-origin:center}

@keyframes gGlowR{0%{opacity:.6;transform:scale(1.05)}45%{opacity:0;transform:scale(.85)}100%{opacity:0;transform:scale(.85)}}

@keyframes gGlowB{0%,50%{opacity:0;transform:scale(.85)}55%{opacity:.6;transform:scale(1.05)}100%{opacity:0;transform:scale(.85)}}

/* facho do giroflex varrendo o chão da cena */

.sweep-r{animation:gGlowR .7s ease-out infinite;transform-box:fill-box;transform-origin:bottom}

.sweep-b{animation:gGlowB .7s ease-out infinite;transform-box:fill-box;transform-origin:bottom}

/* poeira/garoa atmosférica */

.dust{animation:dustFall linear infinite}

@keyframes dustFall{0%{transform:translateY(-6px);opacity:0}20%{opacity:.5}100%{transform:translateY(46px);opacity:0}}

/* faróis e rastro da viatura no mapa */

.vtr-head{opacity:.2}

.vtr-trail{transition:none}

/* reveal de acerto/erro com IMPACTO */

@keyframes okPop{0%{transform:scale(1)}40%{transform:scale(1.04)}100%{transform:scale(1)}}

@keyframes errShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}

.opt-btn.reveal-ok{animation:okPop .34s cubic-bezier(.34,1.56,.64,1)}

.opt-btn.reveal-err{animation:errShake .32s ease}

/* transição entre telas */

@keyframes screenIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.screen-enter{animation:screenIn .3s cubic-bezier(.4,0,.2,1)}

/* pulso dourado ao subir de faixa de combo */

@keyframes comboLevelUp{0%{box-shadow:0 0 0 rgba(245,158,11,0)}40%{box-shadow:0 0 22px rgba(253,224,71,.95)}100%{box-shadow:0 0 12px rgba(245,158,11,.8)}}

.combo-fill.levelup{animation:comboLevelUp .5s ease}

/* alvos de toque ≥44px + contraste das dicas */

.diff-btn,.btn-back{min-height:44px;display:inline-flex;align-items:center;justify-content:center}

.cena-dica{color:var(--txt-2)!important;font-weight:600}

.recap__cta{display:block;width:100%;margin-top:12px;padding:12px 14px;border:1px solid var(--gold);background:linear-gradient(135deg,rgba(242,181,65,.18),rgba(242,181,65,.06));color:var(--gold-l);border-radius:var(--r-md,14px);font-family:var(--fh),sans-serif;font-weight:800;font-size:14px;cursor:pointer;transition:transform .12s,box-shadow .12s}

.recap__cta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(242,181,65,.25)}

.recap__cta:active{transform:translateY(0)}

.recap__disc--fraco{border-color:rgba(239,68,68,.5);color:#fca5a5}

.lf__patente{margin-top:12px}

.lf__pat-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}

.lf__pat-medal{font-family:var(--fh),sans-serif;font-weight:800;color:var(--gold-l);font-size:14px}

.lf__pat-sub{font-size:12px;color:var(--txt-2)}

.lf__pat-bar{height:7px;border-radius:6px;background:rgba(120,150,210,.15);overflow:hidden}

.lf__pat-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--gold),var(--gold-l));transition:width .5s ease}

.lobby__diaria{border-color:var(--gold)!important;color:var(--gold-l)!important;background:linear-gradient(135deg,rgba(242,181,65,.14),transparent)!important;font-weight:800}

@keyframes promoPulse{0%{transform:scale(1)}40%{transform:scale(1.1);text-shadow:0 0 26px rgba(253,224,71,.9)}100%{transform:scale(1)}}

#screenFase.promo #fuTitle{animation:promoPulse .8s ease}

.radio--falando .radio__dot{animation:radioLive 1s ease-out infinite}

@keyframes radioLive{0%{box-shadow:0 0 0 0 rgba(239,68,68,.55)}70%{box-shadow:0 0 0 7px rgba(239,68,68,0)}100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}}

.radio{position:relative}

.radio__snd{position:absolute;top:7px;right:7px;width:32px;height:27px;display:flex;align-items:center;justify-content:center;background:rgba(120,150,210,.16);border:1px solid var(--bd);border-radius:8px;color:var(--white);font-size:13px;cursor:pointer;z-index:3;line-height:1}

.radio__snd:hover{background:rgba(120,150,210,.28)}

/* ── CENA EM QUADRINHOS (HQ) ── */

.hq{display:flex;flex-direction:column;gap:11px;margin:2px 0}

.hq-defs{position:absolute;width:0;height:0}

.hq-panel{position:relative;border:3px solid #060c18;border-radius:12px;overflow:hidden;background:#0b1426;box-shadow:0 7px 20px rgba(0,0,0,.45),inset 0 0 0 1px rgba(120,150,210,.12);opacity:0;transform:translateY(12px) scale(.99);animation:hqIn .5s cubic-bezier(.34,1.3,.64,1) forwards}

@keyframes hqIn{to{opacity:1;transform:none}}

.hq-panel::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.2px);background-size:6px 6px;mix-blend-mode:overlay}

.hq-svg{display:block;width:100%;aspect-ratio:360/186}

.hq-cap{background:#fde047;color:#1a1407;font-family:var(--fh),sans-serif;font-weight:800;font-size:11.5px;padding:5px 11px;border-bottom:3px solid #060c18;line-height:1.25}

.hq-scene{position:relative;display:block}

.pt-hero{position:relative;width:100%;aspect-ratio:16/9;max-height:230px;border-radius:16px;overflow:hidden;margin:0 auto 18px;border:1px solid rgba(59,130,246,.22);box-shadow:0 10px 30px rgba(0,0,0,.35);display:none}

.pt-hero.on{display:block;animation:ptHeroIn .7s ease}

@keyframes ptHeroIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

.pt-hero__v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

.pt-hero__ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,15,30,.12) 0%,rgba(7,15,30,.34) 55%,rgba(7,15,30,.82) 100%)}

.pt-hero__cap{position:absolute;left:0;right:0;bottom:9px;text-align:center;font-family:var(--fh);font-size:10.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.82)}

/* ── Apresentação de abertura (vídeo cinematográfico + pular) ── */

.pt-intro{position:fixed;inset:0;z-index:2147483000;background:#05080f;display:none;overflow:hidden}

.pt-intro.on{display:block;animation:ptIntroIn .5s ease}

.pt-intro.out{animation:ptIntroOut .46s ease forwards}

@keyframes ptIntroIn{from{opacity:0}to{opacity:1}}

@keyframes ptIntroOut{from{opacity:1}to{opacity:0}}

.pt-intro__v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}

.pt-intro__ov{position:absolute;inset:0;background:radial-gradient(125% 95% at 50% 32%,rgba(5,8,15,.18),rgba(5,8,15,.88) 76%)}

.pt-intro__c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;gap:8px}

.pt-intro__brasao{width:72px;height:72px;opacity:0;animation:ptUp .7s .15s ease forwards;filter:drop-shadow(0 4px 14px rgba(0,0,0,.6))}

.pt-intro__t{font-family:var(--fh),sans-serif;font-size:34px;font-weight:900;letter-spacing:1px;color:#fff;margin:8px 0 0;opacity:0;animation:ptUp .7s .35s ease forwards;text-shadow:0 2px 18px rgba(0,0,0,.6)}

.pt-intro__t b{color:var(--gold-l)}

.pt-intro__sub{max-width:330px;color:#cdd7ee;font-size:14.5px;line-height:1.5;opacity:0;animation:ptUp .7s .55s ease forwards}

.pt-intro__go{margin-top:20px;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border:none;border-radius:12px;font-family:var(--fh),sans-serif;font-weight:800;font-size:16px;padding:13px 30px;cursor:pointer;box-shadow:0 8px 24px rgba(37,99,235,.4);opacity:0;animation:ptUp .7s .75s ease forwards;min-height:48px}

.pt-intro__skip{position:absolute;top:calc(12px + env(safe-area-inset-top,0));right:14px;background:rgba(0,0,0,.42);color:#e6ecf7;border:1px solid rgba(255,255,255,.18);border-radius:20px;font-size:13px;font-weight:700;padding:7px 15px;cursor:pointer;z-index:2;min-height:40px}

@keyframes ptUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

body.pt-intro-open{overflow:hidden}

body.pt-intro-open #pl-tmr-fab,body.pt-intro-open .leao-fab,body.pt-intro-open #leaoFab{display:none!important}

@media(prefers-reduced-motion:reduce){.pt-intro.on,.pt-intro__brasao,.pt-intro__t,.pt-intro__sub,.pt-intro__go{animation:none;opacity:1}}

.hq-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;opacity:0;transition:opacity .45s ease}

.hq-img.on{opacity:1}

.hq-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;opacity:0;transition:opacity .5s ease}

.hq-vid.on{opacity:1}

/* "quadrinho vivo": leve Ken Burns na cena + luzes de viatura pulsando no asfalto (azul<->vermelho) */

.hq-fx{position:absolute;inset:0;z-index:2;pointer-events:none;mix-blend-mode:screen;opacity:0}

.hq-fx-r{background:radial-gradient(58% 42% at 17% 103%,rgba(239,68,68,.55),transparent 64%)}

.hq-fx-b{background:radial-gradient(58% 42% at 83% 103%,rgba(59,130,246,.55),transparent 64%)}

.hq-scene.live .hq-fx-r{animation:hqRed 3.4s ease-in-out infinite}

.hq-scene.live .hq-fx-b{animation:hqBlue 3.4s ease-in-out infinite}

@keyframes hqRed{0%,100%{opacity:.3}50%{opacity:.05}}

@keyframes hqBlue{0%,100%{opacity:.05}50%{opacity:.3}}

.hq-scene.live .hq-img,.hq-scene.live .hq-svg{animation:hqKen 24s ease-in-out infinite alternate;will-change:transform}

@keyframes hqKen{from{transform:scale(1.05)}to{transform:scale(1.12) translate(-1.4%,-1%)}}

/* pausa as animações dos painéis FORA da viewport (economia de bateria/CPU no mobile) */

.hq-scene.hq-paused .hq-img,.hq-scene.hq-paused .hq-svg,.hq-scene.hq-paused .hq-fx-r,.hq-scene.hq-paused .hq-fx-b{animation:none!important;will-change:auto}

.hq-scene.has-vid .hq-img,.hq-scene.has-vid .hq-svg{animation:none!important;will-change:auto}   /* vídeo opaco cobre o still → não anima o que está invisível (poupa GPU) */

@media(prefers-reduced-motion:reduce){.hq-scene.live .hq-fx-r,.hq-scene.live .hq-fx-b,.hq-scene.live .hq-img,.hq-scene.live .hq-svg{animation:none}.hq-fx{opacity:.3}.pt-hero.on{animation:none}}

/* FALAS numa faixa ABAIXO da imagem → a cena fica 100% visível (perfeitamente enquadrada) + diálogo limpo */

/* falas EMPILHADAS (largura total) abaixo da cena — cada uma com o RÓTULO de quem fala,

   sem lado esq/dir → nunca cai no personagem errado (a IA posiciona os personagens livremente). */

.hq-talk{display:flex;flex-direction:column;gap:7px;padding:10px 9px 8px;background:#0a1018}

.hq-bubble{position:relative;width:100%;box-sizing:border-box;background:#f7f9fd;color:#0b1220;border:2px solid #060c18;border-radius:12px;padding:7px 12px 9px;font-family:var(--fb),sans-serif;font-weight:600;font-size:12.5px;line-height:1.3;overflow-wrap:break-word;box-shadow:1.5px 2px 0 rgba(6,12,24,.5);opacity:0;transform:translateY(7px);animation:hqPop .34s cubic-bezier(.34,1.56,.64,1) forwards}

@keyframes hqPop{to{opacity:1;transform:none}}

.hq-quem{display:block;font-family:var(--fh),sans-serif;font-weight:900;font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:#1d4ed8;margin-bottom:3px}

.hq-bubble--grito{background:#fee2e2;border-color:#7f1d1d;color:#7f1d1d;font-weight:800}

.hq-bubble--grito .hq-quem{color:#8b0000}

.hq-bubble--pensa{background:#eaf0fb;border-style:dashed;font-style:italic}

/* rabicho só no 1º balão, apontando pra cena (em cima, à esquerda) */

.hq-bubble:first-child::after{content:'';position:absolute;top:-8px;left:22px;width:0;height:0;border:7px solid transparent;border-bottom-color:#060c18}

.hq-bubble:first-child::before{content:'';position:absolute;top:-5px;left:23px;width:0;height:0;border:5px solid transparent;border-bottom-color:#f7f9fd;z-index:1}

.hq-bubble--grito:first-child::before{border-bottom-color:#fee2e2}

.hq-bubble--pensa:first-child::before{border-bottom-color:#eaf0fb}

@media(max-width:430px){ .hq-bubble{font-size:12px;padding:7px 11px 8px;line-height:1.28} .hq-cap{font-size:11px} }

@media(prefers-reduced-motion:reduce){.hq-panel,.hq-bubble{animation:none;opacity:1;transform:none}}

.mapa-instru{color:var(--txt-2)}

@media(prefers-reduced-motion:reduce){.giro-glow-r,.giro-glow-b,.sweep-r,.sweep-b,.dust,.opt-btn.reveal-ok,.opt-btn.reveal-err,.screen-enter,.combo-fill.levelup{animation:none}}



/* ── Briefing (chamado CICOM) ── */

.brief{background:var(--navy-2);border:1px solid rgba(59,130,246,.2);border-radius:20px;padding:22px 20px}

.brief__head{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}

.brief__badge{font-family:var(--fh);font-size:10px;font-weight:800;letter-spacing:1px;padding:4px 10px;border-radius:20px;text-transform:uppercase}

.badge-alta{background:rgba(239,68,68,.16);border:1px solid rgba(239,68,68,.4);color:#fca5a5}

.badge-media{background:rgba(245,158,11,.16);border:1px solid rgba(245,158,11,.4);color:var(--gold-l)}

.brief__nat{font-family:var(--fh);font-size:18px;font-weight:900;color:#fff}

.brief__cod{font-size:11px;color:var(--sil);font-weight:600;margin-left:auto}

.brief__edital{margin-top:12px;background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.25);border-radius:12px;padding:11px 14px;display:flex;flex-direction:column;gap:7px}

.brief__edital-top{display:flex;align-items:center;gap:7px;font-family:var(--fh);font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--gold-l);flex-wrap:wrap}

.brief__edital-main{font-size:13.5px;font-weight:700;color:#eef1f8;line-height:1.4}

.brief__edital-main b{color:var(--gold-l)}

.brief__edital-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.edital-chip{font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;background:rgba(59,130,246,.14);border:1px solid rgba(59,130,246,.3);color:var(--tac-l)}
.edital-chip--jur{background:rgba(34,197,94,.13);border-color:rgba(34,197,94,.34);color:#9af7c3;font-weight:800}
.edital-chip--meu{background:rgba(251,191,36,.18);border-color:rgba(251,191,36,.55);color:#fde68a;font-weight:800}
.edital-mine{font-size:10.5px;font-weight:800;padding:2px 9px;border-radius:20px;background:rgba(34,197,94,.16);border:1px solid rgba(34,197,94,.4);color:#86efac}

.bo__edital{display:block;margin:6px 0 2px 23px;font-size:10.5px;font-weight:700;color:var(--tac-l)}

.bo__edital b{color:var(--gold-l)}

.bo__edital .mine{color:#86efac;margin-left:4px}

.radio{margin:14px 0;background:#07101f;border:1px solid rgba(59,130,246,.25);border-radius:12px;padding:14px 16px;position:relative;overflow:hidden}

.radio::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(59,130,246,.04) 0 2px,transparent 2px 4px)}

.radio__top{display:flex;align-items:center;gap:8px;margin-bottom:8px}

.radio__dot{width:9px;height:9px;border-radius:50%;background:var(--err);box-shadow:0 0 8px var(--err);animation:pulse 1.1s infinite}

@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

.radio__from{font-family:var(--fh);font-size:11px;font-weight:800;letter-spacing:1px;color:var(--tac-l)}

.radio__txt{font-size:14.5px;line-height:1.6;color:#dfe7f6;min-height:44px}

.radio__cursor{display:inline-block;width:8px;height:16px;background:var(--tac-l);vertical-align:-2px;animation:blink .8s steps(1) infinite}

@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}

.brief__ctx{font-size:14px;line-height:1.6;color:var(--sil);margin:12px 2px 0}

.brief__ctx b{color:#cdd7ee}

.btn-assumir{display:block;width:100%;margin-top:18px;padding:15px;border-radius:12px;font-family:var(--fh);font-weight:900;font-size:15px;background:linear-gradient(135deg,#065f46,var(--accent));color:#fff;border:none;cursor:pointer;transition:.2s;box-shadow:0 4px 18px rgba(16,185,129,.35)}

.btn-assumir:hover{filter:brightness(1.1);transform:translateY(-2px)}

/* ── briefing PAGINADO (1 chamado → 2 cena → 3 situação) ── */

.brief__steps{display:flex;gap:8px;justify-content:center;margin:2px 0 14px}

.brief__steps i{width:24px;height:5px;border-radius:3px;background:rgba(140,165,210,.22);transition:.25s}

.brief__steps i.on{background:var(--gold-l,#fcd34d)}

.brief__steps i.done{background:rgba(140,165,210,.5)}

.brief__beat-tit{font-family:var(--fh);font-size:11px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--tac-l,#9fb4dd);margin:0 0 10px;text-align:center}

.brief__beat{animation:beatIn .3s ease}

@keyframes beatIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}

.brief__nav{display:flex;gap:9px;align-items:stretch;margin-top:14px}

.brief__nav .btn-assumir{flex:1;margin-top:0}

.btn-brief-next{display:block;width:100%;margin-top:14px;padding:14px;border:none;border-radius:12px;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;font-family:var(--fh);font-weight:800;font-size:15px;cursor:pointer;transition:.18s;box-shadow:0 4px 16px rgba(37,99,235,.35)}

.btn-brief-next:hover{filter:brightness(1.08);transform:translateY(-1px)}

.btn-brief-back{padding:14px 15px;border:1px solid rgba(140,165,210,.22);border-radius:12px;background:rgba(140,165,210,.07);color:#cdd7ee;font-family:var(--fh);font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap;transition:.18s}

.btn-brief-back:hover{background:rgba(140,165,210,.14)}

.btn-brief-next:active,.btn-brief-back:active{transform:scale(.97)}

.btn-repetir{display:block;width:100%;margin-top:10px;padding:11px;border:1px solid rgba(96,165,250,.4);border-radius:12px;background:rgba(59,130,246,.12);color:#bfdbfe;font-family:var(--fh),sans-serif;font-weight:700;font-size:13.5px;cursor:pointer;transition:.18s}

.btn-repetir:hover{background:rgba(59,130,246,.2)}

.btn-repetir:active{transform:scale(.97)}

.radio__snd--off{animation:sndHint 2.2s ease-in-out infinite}

@keyframes sndHint{0%,100%{transform:scale(1);box-shadow:0 0 0 rgba(96,165,250,0)}50%{transform:scale(1.12);box-shadow:0 0 10px rgba(96,165,250,.5)}}



/* ── HUD ── */

.hud{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;flex-wrap:wrap}

.hud__progress{font-family:var(--fh);font-size:13px;font-weight:700;color:var(--sil)}

.hud__progress strong{color:var(--white)}

.hud__right{display:flex;align-items:center;gap:10px}

.hud__score{font-family:var(--fh);font-size:20px;font-weight:900;color:var(--al);transition:transform .15s}

.hud__score.bump{transform:scale(1.25)}

.hud__mult{font-family:var(--fh);font-size:11px;font-weight:800;padding:4px 9px;border-radius:20px;border:1px solid;opacity:.9}

.combo-meter{margin-bottom:10px}

.combo-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--fh);font-size:11px;font-weight:800;color:var(--sil);margin-bottom:4px}

.combo-top.hot .lbl{color:var(--gold)}

.combo-bar{height:6px;background:rgba(255,255,255,.07);border-radius:99px;overflow:hidden}

.combo-fill{height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#1d4ed8,#60a5fa);transition:width .3s ease}

.combo-fill.hot{box-shadow:0 0 12px rgba(245,158,11,.8);background:linear-gradient(90deg,#f59e0b,#fde047)}

.timer-wrap{height:6px;background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden;margin-bottom:14px}
.timer-bar{height:100%;border-radius:99px;background:var(--tac);transition:width 1s linear,background .3s}
.jur-track{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px;padding:8px 10px;border:1px solid rgba(34,197,94,.28);border-radius:12px;background:rgba(34,197,94,.08);font-family:var(--fh);font-size:11px;font-weight:850;color:#dbeafe}
.jur-track__tag{color:#9af7c3;text-transform:uppercase;letter-spacing:0;white-space:nowrap}
.jur-track__foco{color:#dbeafe;line-height:1.35}


/* ── Cena na partida + pergunta ── */

.scene-strip{position:relative;border-radius:14px;overflow:hidden;margin-bottom:12px;border:1px solid rgba(59,130,246,.2)}

.scene-strip .cena-wrap{border:none;border-radius:0}

.scene-tag{position:absolute;top:10px;left:10px;z-index:2;display:flex;gap:6px;align-items:center;flex-wrap:wrap}

.scene-tag span{font-family:var(--fh);font-size:10px;font-weight:800;letter-spacing:.5px;padding:4px 9px;border-radius:20px;background:rgba(7,13,24,.82);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.12);color:#cdd7ee}

.q-card{background:var(--navy-2);border:1px solid rgba(59,130,246,.16);border-radius:18px;padding:20px;margin-bottom:14px}

.q-tipo{font-family:var(--fh);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--tac-l);margin-bottom:8px}

.q-texto{font-size:16.5px;line-height:1.55;color:#fff;font-weight:600}

.opt-grid{display:grid;grid-template-columns:1fr;gap:10px}

.opt-btn{position:relative;padding:15px 16px 15px 44px;border-radius:14px;border:2px solid rgba(59,130,246,.18);background:linear-gradient(180deg,var(--navy-3),#0c1626);color:#eaf0fb;font-family:var(--fb);font-size:14.5px;font-weight:600;cursor:pointer;transition:transform .1s,border-color .15s,background .15s;text-align:left;line-height:1.4;user-select:none;box-shadow:0 5px 0 rgba(0,0,0,.3)}

.opt-btn .key{position:absolute;top:50%;left:14px;transform:translateY(-50%);width:22px;height:22px;border-radius:7px;background:rgba(59,130,246,.18);border:1px solid rgba(59,130,246,.3);font-family:var(--fh);font-size:12px;font-weight:800;color:var(--tac-l);display:flex;align-items:center;justify-content:center}

.opt-btn:hover:not(:disabled){border-color:rgba(96,165,250,.55);background:rgba(59,130,246,.1);transform:translateY(-2px)}

.opt-btn:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px 0 rgba(0,0,0,.3)}

.opt-btn.reveal-ok{border-color:var(--ok)!important;background:rgba(34,197,94,.2)!important;color:#bbf7d0!important;box-shadow:0 0 18px rgba(34,197,94,.45)!important}

.opt-btn.reveal-ok .key{background:rgba(34,197,94,.3);border-color:var(--ok);color:#bbf7d0}

.opt-btn.reveal-err{border-color:var(--err)!important;background:rgba(239,68,68,.18)!important;color:#fecaca!important}

.opt-btn.reveal-err .key{background:rgba(239,68,68,.3);border-color:var(--err);color:#fecaca}

.opt-btn.dim{opacity:.4}

.opt-btn:disabled{cursor:default}



/* ── Feedback toast ── */

.feedback{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%) translateY(calc(100% + 32px));width:calc(100% - 32px);max-width:628px;z-index:100;background:var(--navy-3);border:1px solid rgba(59,130,246,.25);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;box-shadow:0 16px 48px rgba(0,0,0,.6);transition:.35s cubic-bezier(.34,1.56,.64,1);pointer-events:none}

.feedback__body{display:flex;align-items:flex-start;gap:14px;max-height:min(56vh,440px);overflow-y:auto;-webkit-overflow-scrolling:touch}

.feedback__seguir{flex:none;width:100%;padding:14px;border:none;border-radius:12px;background:linear-gradient(135deg,#1e3a8a,var(--tac));color:#fff;font-family:var(--fh);font-weight:800;font-size:15px;cursor:pointer;box-shadow:0 4px 14px rgba(59,130,246,.4);transition:filter .15s}

.feedback__seguir:hover{filter:brightness(1.12)}.feedback__seguir:active{transform:scale(.99)}

.feedback.show{transform:translateX(-50%) translateY(0);pointer-events:auto}

.feedback.perfect{border-color:var(--ok);background:linear-gradient(rgba(20,83,45,.55),rgba(20,83,45,.55)),var(--navy-3)}

.feedback.wrong{border-color:var(--err);background:linear-gradient(rgba(120,20,20,.5),rgba(120,20,20,.5)),var(--navy-3)}

.feedback__icon{font-size:28px;flex-shrink:0;line-height:1.1}

.feedback__text{flex:1}

.feedback__title{font-family:var(--fh);font-size:14px;font-weight:800}

.feedback__sub{font-size:12.5px;color:rgba(255,255,255,.78);margin-top:4px;line-height:1.55}

.feedback__base{display:block;margin-top:10px;padding-top:8px;border-top:1px solid var(--bd);font-size:12px;font-weight:700;color:var(--gold-l)}

.fb__diff{margin:2px 0 9px}

.fb__err{color:#fca5a5;border-left:3px solid var(--err);padding:2px 0 2px 9px;margin-bottom:5px;font-size:12.5px}

.fb__ok{color:#86efac;border-left:3px solid var(--ok);padding:2px 0 2px 9px;font-size:12.5px;font-weight:600}

.fb__why{line-height:1.62;font-size:13px}

.fb__lbl{display:block;font-family:var(--fh);font-size:9.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;opacity:.55;margin-bottom:3px}

.fb__macete{margin-top:9px;background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.22);border-radius:8px;padding:8px 11px;font-size:12.5px;color:#fde68a;line-height:1.5}

.feedback__cont{display:none}

.feedback__pts{font-family:var(--fh);font-size:21px;font-weight:900;color:var(--al);flex-shrink:0}

.feedback.perfect .feedback__pts{color:#4ade80}

.feedback.wrong .feedback__pts{color:#f87171}



/* ── Result / Relatório ── */

.result{background:var(--navy-2);border:1px solid rgba(59,130,246,.18);border-radius:20px;padding:32px 24px;text-align:center}

.result__icon{font-size:64px;margin-bottom:8px;display:block;animation:pop .4s ease}

@keyframes pop{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}

.result__title{font-family:var(--fh);font-size:24px;font-weight:900;margin-bottom:4px}

.result__rank{font-family:var(--fh);font-size:12px;font-weight:800;letter-spacing:1px;color:var(--gold-l);text-transform:uppercase;margin-bottom:10px}

.result__score{font-family:var(--fh);font-size:48px;font-weight:900;color:var(--al);line-height:1;margin:10px 0 2px}

.result__raw{font-size:12px;color:var(--sil);margin-bottom:4px}

.result__sub{font-size:13px;color:var(--sil);margin-bottom:22px}

.result__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:22px}

.result__stat{background:var(--navy-3);border-radius:10px;padding:14px 8px}

.result__stat-val{font-family:var(--fh);font-size:21px;font-weight:900;color:var(--al)}

.result__stat-lbl{font-size:11px;color:var(--sil);margin-top:3px}

/* relatório BO */

.bo{text-align:left;margin-bottom:22px}

.bo__title{font-family:var(--fh);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--tac-l);margin-bottom:10px;display:flex;align-items:center;gap:7px}

.bo__occ{margin-bottom:14px;background:var(--navy-3);border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.05)}

.bo__occ-head{padding:10px 14px;font-family:var(--fh);font-size:12.5px;font-weight:800;color:#cdd7ee;background:rgba(59,130,246,.08);border-bottom:1px solid rgba(255,255,255,.05);display:flex;align-items:center;gap:8px}

.bo__row{padding:11px 14px;border-bottom:1px solid rgba(255,255,255,.04)}

.bo__row:last-child{border-bottom:none}

.bo__q{font-size:13px;font-weight:700;color:#e7edf8;display:flex;gap:8px;line-height:1.45}

.bo__q .mark{flex-shrink:0;font-size:15px}

.bo__ans{font-size:12.5px;color:var(--sil);margin:5px 0 0 23px;line-height:1.5}

.bo__ans b{color:#bbf7d0}

.bo__ans .miss{color:#fca5a5}

.bo__base{display:inline-block;margin:6px 0 0 23px;font-size:10.5px;font-weight:700;color:var(--gold-l);background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.22);border-radius:6px;padding:2px 8px}

.result__actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:26px}

.btn-replay{padding:13px 26px;border-radius:10px;font-family:var(--fh);font-weight:800;font-size:14px;background:linear-gradient(135deg,#1e3a8a,var(--tac));color:#fff;border:none;cursor:pointer;transition:.2s}

.btn-replay:hover{filter:brightness(1.1)}

.btn-hub{padding:13px 22px;border-radius:10px;font-family:var(--fh);font-weight:700;font-size:14px;background:rgba(255,255,255,.07);color:var(--sil);border:1px solid rgba(255,255,255,.12);cursor:pointer;transition:.2s}

.btn-hub:hover{color:var(--white)}

/* ranking */

.mini-rank{background:var(--navy-3);border-radius:14px;overflow:hidden;text-align:left}

.mini-rank-head{padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.05);display:flex;justify-content:space-between;align-items:center}

.mini-rank-head h3{font-family:var(--fh);font-size:13px;font-weight:800}

.period-tabs{display:flex;gap:4px}

.period-tab{padding:9px 14px;min-height:44px;display:inline-flex;align-items:center;border-radius:6px;font-size:11px;font-weight:700;cursor:pointer;color:var(--sil);border:1px solid transparent;transition:.2s}

.period-tab.active{background:rgba(59,130,246,.2);border-color:rgba(59,130,246,.35);color:var(--tac-l)}

.rank-rows{padding:4px 0}

.rrow{display:grid;grid-template-columns:30px 28px 1fr auto;align-items:center;gap:8px;padding:8px 14px;border-radius:8px;transition:.2s}

.rrow--self{background:rgba(59,130,246,.1);border:1px solid rgba(59,130,246,.2)}

.rpos{font-family:var(--fh);font-size:12px;font-weight:800;text-align:center;color:var(--sil)}

.rpos-1{color:#f59e0b}.rpos-2{color:#94a3b8}.rpos-3{color:#b87333}

.rav{width:28px;height:28px;border-radius:50%;background:var(--navy-4);display:flex;align-items:center;justify-content:center;font-family:var(--fh);font-size:11px;font-weight:800;color:var(--tac-l);flex-shrink:0}

.rname{font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.rscore{font-family:var(--fh);font-size:14px;font-weight:900;color:var(--al);text-align:right}

.rscore-1{color:#f59e0b}.rscore-2{color:#94a3b8}.rscore-3{color:#b87333}

.rdiff{font-size:9px;opacity:.55;margin-top:1px}

.disclaimer{font-size:11px;color:var(--sil);opacity:.7;line-height:1.5;margin-top:18px;text-align:center}

/* ── Mapa interativo (overworld) ── */

.mapa-hud{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;flex-wrap:wrap;font-family:var(--fh)}

.mapa-hud__left{font-size:13px;font-weight:800;color:#cdd7ee}

.mapa-hud__left b{color:var(--tac-l)}

.mapa-hud__prio{font-size:12px;font-weight:700;margin-left:6px}

.mapa-hud__score{font-size:18px;font-weight:900;color:var(--al)}

.mapa-instru{font-size:12.5px;color:var(--sil);text-align:center;margin:0 0 8px;line-height:1.45}
.mapa-wrap{position:relative;width:100%;max-width:420px;margin:0 auto;aspect-ratio:1/1;max-height:min(72svh,460px);border-radius:16px;overflow:hidden;border:1px solid rgba(59,130,246,.22);background:#070d18}
.mapa-svg{width:100%;height:100%;display:block;touch-action:manipulation;cursor:pointer}
.vtr-route{filter:drop-shadow(0 0 8px rgba(250,204,21,.38))}
.drive-pad{position:absolute;left:10px;bottom:10px;z-index:5;display:grid;grid-template-columns:42px 42px 42px;grid-template-rows:42px 42px;gap:6px;pointer-events:none}
.drive-btn{width:42px;height:42px;border-radius:12px;border:1px solid rgba(191,219,254,.3);background:rgba(8,18,34,.74);color:#eaf2ff;font-family:var(--fh);font-size:18px;font-weight:900;line-height:1;box-shadow:0 8px 20px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.08);cursor:pointer;touch-action:none;pointer-events:auto;-webkit-tap-highlight-color:transparent}
.drive-btn:active,.drive-btn.is-down{background:rgba(37,99,235,.72);border-color:rgba(219,234,254,.78);transform:translateY(1px)}
.drive-btn--up{grid-column:2;grid-row:1}.drive-btn--left{grid-column:1;grid-row:2}.drive-btn--down{grid-column:2;grid-row:2}.drive-btn--right{grid-column:3;grid-row:2}
@media(min-width:760px){.drive-pad{display:none}}
#vtrTop{transition:none}
.pin{cursor:pointer}
.pin-halo{transform-box:fill-box;transform-origin:center;animation:pinPulse 1.7s ease-out infinite}

.pin--alta .pin-halo{animation-duration:1s}

@keyframes pinPulse{0%{transform:scale(.6);opacity:.5}70%{opacity:0}100%{transform:scale(2.2);opacity:0}}

.pin--armado .pin-body{filter:drop-shadow(0 0 7px #fff)}

.pin:focus{outline:none}

.pin:focus .pin-body{filter:drop-shadow(0 0 7px var(--tac-l))}

.btn-atender{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom,0px));display:none;width:100%;max-width:420px;margin:12px auto 0;padding:15px;border-radius:12px;font-family:var(--fh);font-weight:900;font-size:15px;background:linear-gradient(135deg,#7f1d1d,var(--err));color:#fff;border:none;cursor:pointer;box-shadow:0 6px 22px rgba(239,68,68,.45);animation:atenderUp .25s ease}

.btn-atender.show{display:block}
@keyframes atenderUp{from{transform:translateY(14px);opacity:0}to{transform:translateY(0);opacity:1}}
.btn-prox{display:block;width:100%;max-width:420px;margin:8px auto 0;padding:11px;border-radius:10px;font-family:var(--fh);font-weight:700;font-size:13px;background:rgba(255,255,255,.07);color:var(--sil);border:1px solid rgba(255,255,255,.12);cursor:pointer;transition:.2s}
.btn-prox:hover{color:#fff}
.mapa-radio{width:100%;max-width:420px;margin:0 auto 8px;background:rgba(6,14,28,.86);border:1px solid rgba(96,165,250,.22);border-left:3px solid var(--tac);border-radius:12px;padding:10px 11px 11px;box-shadow:0 8px 24px rgba(2,6,16,.28)}
.mapa-radio__top{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.mapa-radio__from{font-family:var(--fh);font-size:10.5px;font-weight:900;letter-spacing:.8px;text-transform:uppercase;color:var(--tac-l);min-width:0;flex:1}
.mapa-radio__play{width:44px;min-width:44px;min-height:40px;border-radius:10px;border:1px solid rgba(96,165,250,.35);background:rgba(37,99,235,.20);color:#dbeafe;font-family:var(--fh);font-size:14px;font-weight:900;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mapa-radio__play:active{transform:translateY(1px)}
.mapa-radio__meta{display:flex;align-items:center;gap:7px;margin-bottom:4px;color:#dce7fb;font-family:var(--fh);font-size:12px;font-weight:900;min-width:0}
#mapaRadioNat{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mapa-radio__nivel{font-size:10.5px;font-weight:900;padding:2px 7px;border-radius:999px;background:rgba(34,197,94,.12);color:#9af7c3;border:1px solid rgba(34,197,94,.35);white-space:nowrap}
.mapa-radio__prio{font-size:10.5px;font-weight:900;padding:2px 7px;border-radius:999px;background:rgba(245,158,11,.14);color:#fcd34d;border:1px solid rgba(245,158,11,.35);white-space:nowrap}
.mapa-radio--alta{border-left-color:var(--err)}
.mapa-radio--alta .mapa-radio__prio{background:rgba(239,68,68,.14);border-color:rgba(239,68,68,.38);color:#fca5a5}
.mapa-radio__msg{color:#b9c6df;font-size:12.5px;line-height:1.42;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mapa-radio__status{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:7px;color:#8fa1c5;font-size:11.5px;font-weight:800}
.mapa-radio__dist{color:#dbeafe;font-family:var(--fh);font-size:11.5px;font-weight:900;white-space:nowrap}
.mapa-radio__bar{height:4px;border-radius:999px;background:rgba(120,150,210,.16);overflow:hidden;margin-top:6px}
.mapa-radio__bar span{display:block;height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,var(--tac),var(--al));transition:width .18s ease}
.mapa-radio--alta .mapa-radio__bar span{background:linear-gradient(90deg,var(--err),var(--gold-l))}
.mapa-actions{width:100%;max-width:420px;margin:8px auto 0;display:flex;flex-direction:column;gap:8px}
.mapa-actions .btn-atender,.mapa-actions .btn-prox{max-width:none;margin:0}
.mapa-actions .btn-atender{width:100%}
body.pt-city-mode{align-items:stretch;min-height:100svh;background:#050b16}
body.pt-city-mode .wrap{max-width:none;min-height:calc(100svh - 52px);padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));padding-left:max(12px,env(safe-area-inset-left,0));padding-right:max(12px,env(safe-area-inset-right,0));display:flex;flex-direction:column}
body.pt-city-mode #screenMapa{flex:1;min-height:0;display:flex!important;flex-direction:column}
body.pt-city-mode .mapa-hud{flex:0;margin-bottom:8px;background:rgba(10,22,40,.92);-webkit-backdrop-filter:saturate(140%) blur(8px);backdrop-filter:saturate(140%) blur(8px)}
body.pt-city-mode .mapa-instru{flex:0;width:min(100%,620px);margin:0 auto 8px;text-align:left;background:rgba(14,27,51,.72);border:1px solid var(--bd);border-radius:12px;padding:9px 12px;color:#cbd7ef}
body.pt-city-mode .mapa-radio{flex:0;width:min(100%,620px);max-width:620px;margin:0 auto 8px}
body.pt-city-mode .mapa-wrap{flex:0 0 auto;min-height:0;width:min(100%,620px,calc(100svh - 266px));max-width:620px;max-height:none;margin:0 auto;align-self:center;aspect-ratio:1/1;border-radius:18px;box-shadow:inset 0 1px 0 var(--top-light),0 18px 52px rgba(2,6,16,.62)}
body.pt-city-mode .mapa-wrap::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:18px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),inset 0 -36px 70px rgba(2,6,16,.28)}
body.pt-city-mode .mapa-actions{flex:0;width:min(100%,620px);max-width:620px;margin:8px auto 0;display:grid;grid-template-columns:1fr;gap:8px}
body.pt-city-mode .mapa-actions .btn-atender,body.pt-city-mode .mapa-actions .btn-prox{position:static;width:100%;max-width:none;margin:0;min-height:56px;padding:15px 16px;font-size:14px}
@media(min-width:760px){body.pt-city-mode .mapa-actions{grid-template-columns:1.2fr 1fr 1fr}body.pt-city-mode .mapa-actions .btn-atender.show{display:block}}
/* recap do mapa no resultado */
.recap{background:var(--navy-3);border:1px solid rgba(59,130,246,.18);border-radius:14px;padding:14px 16px;margin-bottom:18px;text-align:left}

.recap__title{font-family:var(--fh);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--tac-l);margin-bottom:9px;display:flex;align-items:center;gap:7px}

.recap__phrase{font-size:13px;color:#cdd7ee;line-height:1.55;margin-bottom:10px}

.recap__phrase b{color:var(--gold-l)}

.recap__item{display:flex;align-items:flex-start;gap:9px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.05)}

.recap__item:last-child{border-bottom:none}

.recap__emoji{font-size:18px;flex-shrink:0;line-height:1.25}

.recap__nat{font-weight:700;color:#e7edf8;font-size:13px}

.recap__ed{font-size:11.5px;color:var(--gold-l);margin-top:2px;line-height:1.4}

.recap__ed .mine{color:#86efac;margin-left:4px}

.recap__discs{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}

.recap__disc{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;background:rgba(59,130,246,.14);border:1px solid rgba(59,130,246,.3);color:var(--tac-l)}

.recap__disc b{color:#fff}

/* lobby: bloco de fase */

.lobby__fase{background:var(--navy-3);border:1px solid rgba(245,158,11,.25);border-radius:14px;padding:15px;margin:6px 0 2px;text-align:center}

.lf__big{font-family:var(--fh);font-size:17px;font-weight:800;color:#eaf0fb}

.lf__big span{color:var(--gold-l)}

.lf__big b{font-size:22px}

.lf__sub{font-size:12.5px;color:var(--sil);line-height:1.5;margin-top:6px}

.lf__sub b{color:#cdd7ee}

/* intersticial entre fases */

.faseup{background:var(--navy-2);border:1px solid rgba(34,197,94,.3);border-radius:20px;padding:34px 24px;text-align:center}

.faseup__badge{display:inline-block;font-family:var(--fh);font-size:11px;font-weight:900;letter-spacing:1.5px;color:#86efac;background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.4);border-radius:20px;padding:5px 14px;margin-bottom:14px}

.faseup__icon{font-size:62px;display:block;animation:pop .4s ease}

.faseup__title{font-family:var(--fh);font-size:25px;font-weight:900;margin:6px 0 4px}

.faseup__stat{font-size:14px;color:var(--sil);margin-bottom:10px}

.faseup__arrow{font-family:var(--fh);font-size:12px;font-weight:800;letter-spacing:1px;color:var(--gold-l);margin-bottom:18px;animation:pulse 1.4s infinite}

.faseup .btn-start{margin-bottom:10px}

.faseup .btn-hub{display:block;margin:0 auto}

/* estatísticas do lobby + conquistas + botão desistir */

.lobby__stats{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin:10px 0 2px}

.lobby__stats span{font-size:11px;font-weight:700;color:var(--sil);background:var(--navy-3);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:4px 10px}

.lobby__stats b{color:var(--tac-l)}

#resMedals{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin:0 0 18px}

#resMedals:empty{display:none;margin:0}

.res-medal{font-size:12px;font-weight:800;color:var(--gold-l);background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.3);border-radius:20px;padding:5px 12px}

.btn-desistir{margin-top:6px;border-color:rgba(239,68,68,.22)!important;color:#fca5a5!important}

.btn-desistir:hover{color:#fecaca!important}

/* ════════════ REDESIGN PREMIUM — Navy Tático Premium ════════════ */

/* superfícies com profundidade real (cards nível 1) */

.lobby,.brief,.q-card,.result,.faseup{

  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(0,0,0,.06)),var(--navy-2);

  border:1px solid var(--bd-strong);border-radius:var(--r-lg);

  box-shadow:inset 0 1px 0 var(--top-light),var(--sh-2)}

.q-card{border-radius:var(--r-md)}

.lobby__rules,.result__stat,.bo__occ,.recap,.mini-rank{border-color:var(--bd)}

.cena-wrap,.mapa-wrap,.scene-strip{border-color:var(--bd-strong)}

.mapa-wrap{box-shadow:inset 0 1px 0 var(--top-light),var(--sh-2)}

/* topbar nítida */

.topbar{background:rgba(7,16,31,.92);border-bottom:1px solid var(--bd);-webkit-backdrop-filter:saturate(140%) blur(8px);backdrop-filter:saturate(140%) blur(8px)}

.topbar__tag{background:rgba(59,130,246,.14);border-color:var(--bd-tac)}

/* tipografia: números tabulares + escala */

.hud__score,.mapa-hud__score,.result__score,.result__stat-val,.rscore,.combo-num,.lf__big b,.feedback__pts,.brief__cod{font-variant-numeric:tabular-nums}

.lobby__title{font-size:30px;letter-spacing:-.4px}

.q-texto{font-weight:650;color:#fff}

.opt-btn,.brief__ctx,.lobby__sub,.radio__txt{color:var(--txt-2)}

/* tarja de prioridade no briefing */

.brief{position:relative;overflow:hidden}

.brief::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--warn)}

.brief.brief--alta::before{background:var(--err)}

.brief__badge{font-size:9.5px;letter-spacing:1.4px;border-radius:999px}

.brief__nat{font-size:19px}

/* rádio do CICOM */

.radio{background:var(--radio);border:1px solid var(--bd);border-left:3px solid var(--tac);border-radius:var(--r-sm)}

.radio__from{color:var(--tac-l)}

/* HUD em barra de superfície */

.hud,.mapa-hud{background:var(--navy-3);border:1px solid var(--bd);border-radius:var(--r-sm);box-shadow:var(--sh-1)}

.hud{padding:9px 14px}.mapa-hud{padding:8px 13px}

.mapa-hud__left{color:var(--txt-2)}

/* combo + timer: trilhos afundados */

.combo-bar,.timer-wrap{background:var(--sunken);box-shadow:inset 0 1px 2px rgba(0,0,0,.4)}

.combo-fill{background:linear-gradient(90deg,var(--tac-d),var(--tac-l))}

.combo-fill.hot{background:linear-gradient(90deg,var(--gold-d),var(--gold-l));box-shadow:0 0 12px rgba(242,181,65,.7)}

/* opções de decisão — toque tipo console */

.opt-btn{background:linear-gradient(180deg,var(--navy-3),var(--sunken));border:2px solid var(--bd);border-radius:var(--r-md);box-shadow:0 4px 0 rgba(0,0,0,.32);transition:transform .12s cubic-bezier(.4,0,.2,1),border-color .15s,background .15s}

.opt-btn .key{background:rgba(59,130,246,.16);border:1px solid var(--bd-tac);border-radius:var(--r-xs);color:var(--tac-l)}

.opt-btn:hover:not(:disabled){border-color:var(--bd-tac);background:linear-gradient(180deg,rgba(59,130,246,.12),var(--sunken));transform:translateY(-2px)}

.opt-btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 rgba(0,0,0,.32)}

/* toast elevado */

.feedback{background:var(--navy-3);border:1px solid var(--bd-strong);border-left:4px solid var(--tac);border-radius:var(--r-md);box-shadow:var(--sh-3)}

.feedback.perfect{border-left-color:var(--ok)}.feedback.wrong{border-left-color:var(--err)}

/* botões */

.btn-start,.btn-replay{background:linear-gradient(135deg,var(--tac-d),var(--tac));border-radius:var(--r-sm);box-shadow:var(--sh-2);transition:transform .18s cubic-bezier(.4,0,.2,1),filter .18s,box-shadow .18s}

.btn-start:hover,.btn-replay:hover{filter:brightness(1.08);transform:translateY(-2px)}

.btn-start:active,.btn-replay:active{transform:scale(.98)}

.btn-assumir{background:linear-gradient(135deg,#0b6e4f,var(--accent));border-radius:var(--r-sm);box-shadow:var(--sh-2)}

.btn-hub,.btn-prox,.btn-back{background:var(--navy-3);border:1px solid var(--bd);border-radius:var(--r-sm);color:var(--sil);transition:color .18s,background .18s,border-color .18s}

.btn-hub:hover,.btn-prox:hover,.btn-back:hover{color:var(--white);border-color:var(--bd-strong)}

.btn-atender{border-radius:var(--r-sm);box-shadow:var(--sh-2),0 0 0 1px rgba(239,68,68,.3)}

/* lobby: bloco de fase vira tarja dourada */

.lobby__fase{position:relative;overflow:hidden;border-color:var(--bd);text-align:left;padding-left:18px}

.lobby__fase::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--gold)}

.lobby__input{background:var(--sunken);border:1px solid var(--bd);border-radius:var(--r-sm)}

.lobby__input:focus{border-color:var(--tac-l)}

/* chips em pílula com borda neutra */

.lobby__stats span,.edital-chip,.recap__disc,.scene-tag span{border-radius:999px;border-color:var(--bd)}

/* foco acessível global */

a:focus-visible,button:focus-visible,input:focus-visible,.opt-btn:focus-visible,.pin:focus-visible,.period-tab:focus-visible{outline:none;border-color:var(--tac-l);box-shadow:0 0 0 3px rgba(59,130,246,.30)}
.btn-start,.btn-replay,.btn-hub,.btn-prox,.btn-atender,.btn-assumir,.btn-brief-next,.btn-brief-back,.btn-repetir,.lobby__reset,.pt-install__btn,.feedback__seguir,.opt-btn,.mt-item,.treino-disc,.conc-btn,.mapa-radio__play{touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}
.drive-btn{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none}
.drive-btn:focus,.drive-btn:focus-visible{outline:none;box-shadow:0 8px 20px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.08)}
body.pt-demo-modal{overflow:hidden;touch-action:none}
.pt-demo-overlay{position:fixed;inset:0;z-index:2147483600;display:flex;align-items:flex-start;justify-content:center;padding:calc(18px + env(safe-area-inset-top,0px)) 22px calc(18px + env(safe-area-inset-bottom,0px));background:rgba(6,12,26,.86);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
.pt-demo-dialog{width:100%;margin:auto 0;text-align:center;box-shadow:0 28px 80px rgba(0,0,0,.6)}
@media(pointer:coarse){.btn-start,.btn-replay,.btn-hub,.btn-prox,.btn-atender,.btn-assumir,.btn-brief-next,.btn-brief-back,.btn-repetir,.lobby__reset,.pt-install__btn,.feedback__seguir,.opt-btn,.mt-item,.treino-disc,.conc-btn{min-height:48px}.mapa-actions .btn-prox,.mapa-actions .btn-atender{min-height:56px;padding:15px 16px;font-size:14px}.mapa-radio__play{width:48px;min-width:48px;min-height:44px}.drive-btn{width:48px;height:48px}.drive-pad{grid-template-columns:48px 48px 48px;grid-template-rows:48px 48px;gap:7px}}
.lobby__input,.period-tab,.rrow{transition:color .18s,background .18s,border-color .18s}
@media(prefers-reduced-motion:reduce){.brasao,.giro-r,.giro-b,.win-lit,.pin-halo,.radio__dot,.faseup__arrow{animation:none}.btn-atender,.opt-btn,.btn-start,.btn-replay,.feedback,#vtrTop{transition:none}.hud__score.bump{transform:none}}

/* ════════════ MECÂNICAS INTERATIVAS (cena/seq/forca) ════════════ */

.cena-dica{text-align:center;font-size:12.5px;color:var(--txt-3);padding:6px 0}

.hot{cursor:pointer}

.hot-halo{transform-box:fill-box;transform-origin:center;animation:pinPulse 1.7s ease-out infinite}

.hot:focus-visible .hot-ring{stroke:var(--tac-l);stroke-width:2.4}

.hot--ok .hot-ring{stroke:var(--ok);stroke-width:2.6}

.hot--ok .hot-halo{fill:var(--ok);opacity:.55;animation:none}

.hot--err .hot-ring{stroke:var(--err);stroke-width:2.6}

.hot--err .hot-halo{fill:var(--err);opacity:.55;animation:none}

.hot--dim{opacity:.35}.hot--dim .hot-halo{animation:none}

.hot-lbl{font-family:var(--fh);font-size:12.5px;font-weight:800;fill:#eaf0fb;paint-order:stroke;stroke:#060e1c;stroke-width:1.4px;stroke-linejoin:round}

.hot--ok .hot-lbl{fill:#bbf7d0}.hot--err .hot-lbl{fill:#fecaca}

.hot-lbl--por{font-size:10px;fill:#bbf7d0;stroke-width:1.6px}

.mt-sel .hot-ring{stroke:#fde047;stroke-width:2.6px;opacity:1}

.mt-sel .hot-halo{fill:#fbbf24;opacity:.55}

.mt-sel .hot-lbl{fill:#fde68a}

.seq-slot--next{border-color:var(--tac-l);border-style:solid;box-shadow:0 0 0 1px var(--tac-l) inset}

.seq-corrige{display:block;font-size:11.5px;color:#86efac;margin-top:3px;font-weight:600}

.lobby__acoes{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:10px}

.pt-install{margin:14px auto 2px;max-width:340px}
.pt-install__btn{width:100%;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border:none;border-radius:12px;font-family:var(--fh),sans-serif;font-weight:800;font-size:14px;padding:12px 16px;cursor:pointer;box-shadow:0 8px 22px rgba(37,99,235,.35);min-height:46px}
.pt-install__btn:hover{filter:brightness(1.08)}
.pt-install__state{margin-top:8px;font-size:11.5px;color:#9fb0d0;line-height:1.45}
.pt-install__ios{margin-top:8px;font-size:12.5px;color:var(--sil);line-height:1.5;background:var(--navy-3);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:9px 12px;text-align:left}
.treino-grid{display:flex;flex-direction:column;gap:8px;margin-top:14px;text-align:left}

.treino-disc{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;min-height:48px;padding:12px 16px;border-radius:var(--r-sm);background:var(--navy-3);border:1px solid var(--bd-strong);color:var(--txt-1,#eaf0fb);font-family:var(--fh);font-weight:700;font-size:14px;cursor:pointer;transition:border-color .15s,background .15s}

.treino-disc:hover{border-color:var(--tac);background:var(--navy-4,#1B2E6B)}

.treino-disc__n{font-size:11px;font-weight:700;color:var(--txt-3);background:var(--sunken);border-radius:20px;padding:3px 10px;white-space:nowrap}

.lobby__reset{background:transparent;border:1px solid var(--bd-strong);color:var(--txt-3);font-size:12.5px;padding:9px 14px;min-height:42px;border-radius:var(--r-sm);cursor:pointer;font-family:var(--fh);font-weight:700}

.lobby__reset:hover{color:var(--txt-2);border-color:var(--tac)}

.lobby__reset:disabled{opacity:.85;cursor:default;color:#86efac;border-color:#86efac}

.seq-trilha{display:flex;flex-direction:column;gap:7px;margin-bottom:12px}

.seq-slot{display:flex;align-items:center;gap:10px;min-height:48px;padding:8px 12px;border-radius:var(--r-sm);background:var(--sunken);border:1px dashed var(--bd-strong);color:var(--txt-2);font-size:14px;cursor:pointer;transition:border-color .15s,background .15s;line-height:1.35}

.seq-slot--filled{border-style:solid;background:var(--navy-3)}

.seq-num{flex-shrink:0;width:22px;height:22px;border-radius:var(--r-xs);background:rgba(59,130,246,.16);border:1px solid var(--bd-tac);color:var(--tac-l);font-family:var(--fh);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}

.seq-slot-txt{flex:1}

.seq-slot.reveal-ok{border-color:var(--ok);background:rgba(34,197,94,.14)}

.seq-slot.reveal-err{border-color:var(--err);background:rgba(239,68,68,.14)}

.seq-cards{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}

.seq-card{padding:13px 14px;font-size:14px;text-align:left}

.seq-confirm{display:block;margin-top:6px;position:sticky;bottom:8px;z-index:5;box-shadow:0 -2px 14px rgba(7,16,31,.7)}

.seq-confirm:disabled{opacity:.45;cursor:default;box-shadow:var(--sh-1)}

.mt-list{display:flex;flex-direction:column;gap:9px;margin:2px 0 10px}

.mt-item{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;background:var(--navy-3,#13234a);border:1.5px solid var(--bd,rgba(148,163,184,.22));border-radius:13px;padding:13px 15px;color:#e7edf9;font-size:14.5px;font-weight:600;line-height:1.35;cursor:pointer;font-family:inherit;transition:border-color .12s,background .12s}

.mt-item:disabled{cursor:default}

.mt-box{flex:0 0 23px;width:23px;height:23px;margin-top:1px;border-radius:7px;border:2px solid rgba(148,163,184,.5);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;color:transparent}

.mt-item.mt-on{border-color:#fbbf24;background:rgba(251,191,36,.13)}

.mt-item.mt-on .mt-box{background:#fbbf24;border-color:#fbbf24;color:#06210d}

.mt-item.mt-ok{border-color:#22c55e;background:rgba(34,197,94,.14)}

.mt-item.mt-ok .mt-box{background:#22c55e;border-color:#22c55e;color:#06210d}

.mt-item.mt-err{border-color:var(--err,#ef4444);background:rgba(239,68,68,.13)}

.mt-item.mt-err .mt-box{border-color:var(--err,#ef4444);color:var(--err,#ef4444)}

.mt-item.mt-dim{opacity:.5}

.mt-txt{flex:1}

.mt-por{display:block;font-size:12px;font-weight:600;color:#9fb0d6;margin-top:4px}

.mt-confirm{background:linear-gradient(135deg,#16a34a,#22c55e)!important;box-shadow:0 6px 22px rgba(34,197,94,.4)!important;color:#06210d!important}

.conc-pick{margin:8px 0 2px}

.conc-pick__lbl{font-size:12.5px;font-weight:700;color:var(--txt-2,#bcc6e0);text-align:center;margin-bottom:8px}

.conc-pick__row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}

.conc-btn{font-size:12.5px;font-weight:700;padding:9px 13px;border-radius:11px;background:var(--navy-3,#13234a);border:1.5px solid var(--bd,rgba(148,163,184,.24));color:#cdd7ee;cursor:pointer;font-family:inherit}

.conc-btn--on{border-color:#fbbf24;background:rgba(251,191,36,.14);color:#fde68a;font-weight:800}

.tensao-wrap{margin-bottom:14px}

.tensao-lbl{display:block;font-family:var(--fh);font-size:10.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--txt-3);margin-bottom:5px}

.tensao-bar{height:8px;border-radius:99px;background:var(--sunken);overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.4)}

.tensao-fill{height:100%;border-radius:99px;transition:width .5s ease,background .5s}

.forca-regua{display:flex;flex-direction:column;gap:7px}

.forca-faixa{display:flex;align-items:center;gap:11px;min-height:50px;padding:10px 14px;text-align:left}

.forca-ic{font-size:20px;flex-shrink:0;line-height:1}

.forca-rot{font-size:14px;font-weight:600}

.forca-faixa.reveal-ok{border-color:var(--ok)!important;background:rgba(34,197,94,.18)!important;color:#bbf7d0!important}

.forca-faixa.reveal-err{border-color:var(--err)!important;background:rgba(239,68,68,.16)!important;color:#fecaca!important}

.feedback.partial{border-left-color:var(--gold)!important;background:linear-gradient(rgba(120,86,16,.5),rgba(120,86,16,.5)),var(--navy-3)}

.feedback.partial .feedback__pts{color:var(--gold-l)}

@media(prefers-reduced-motion:reduce){.hot-halo,.tensao-fill{animation:none;transition:none}}