/* Convite "Instale o Max Pro" (js/pwa.js), só na versão web do celular. Mesmas cores do app (#0A0A0C, vermelho #E50914). */
#pw-sheet { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 10000; font: 500 15px/1.4 "Figtree", system-ui, sans-serif; color: #fff; }
.pw-dim { position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,.62); opacity: 0; transition: opacity .25s; }
.pw-card { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 22px calc(22px + env(safe-area-inset-bottom)); background: #16161A;
  border-radius: 22px 22px 0 0; box-shadow: 0 -12px 40px rgba(0,0,0,.5); transform: translateY(100%); transition: transform .3s cubic-bezier(.2,.8,.2,1); }
#pw-sheet.on .pw-dim { opacity: 1; }
#pw-sheet.on .pw-card { transform: none; }
.pw-grab { display: block; width: 40px; height: 4px; border-radius: 2px; background: #3A3A42; margin: 0 auto 18px; }
.pw-head { display: flex; align-items: center; }
.pw-icon { width: 64px; height: 64px; border-radius: 16px; margin-right: 16px; box-shadow: 0 6px 18px rgba(229,9,20,.35); background: #000; }
.pw-head h2 { font: 700 22px/1.2 "Sora", "Figtree", sans-serif; margin: 0 0 4px; }
.pw-head p { margin: 0; color: #A3A3AB; font-size: 14.5px; }
.pw-perks { list-style: none; margin: 18px 0 4px; padding: 0; }
.pw-perks li { display: flex; align-items: center; padding: 6px 0; font-size: 15px; color: #E6E6EA; }
.pw-perks svg { width: 20px; height: 20px; margin-right: 12px; stroke: #2ECC71; stroke-width: 2.6; fill: none; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.pw-steps { list-style: none; margin: 14px 0 0; padding: 14px 14px 4px; background: #1E1E23; border-radius: 16px; }
.pw-steps li { display: flex; align-items: flex-start; padding-bottom: 12px; font-size: 15px; color: #E6E6EA; }
.pw-n { flex: none; width: 26px; height: 26px; border-radius: 50%; background: #E50914; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; margin: 0 12px 0 0; }
.pw-steps b { color: #fff; }
.pw-k { display: inline-flex; vertical-align: -6px; width: 26px; height: 26px; border-radius: 7px; background: #2A2A31; align-items: center; justify-content: center; font-style: normal; }
.pw-k svg { width: 18px; height: 18px; stroke: #4DA3FF; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.pw-k svg.f { fill: #fff; stroke: none; }
.pw-acts { margin-top: 18px; }
.pw-btn { display: block; width: 100%; height: 52px; border: 0; border-radius: 14px; background: #2A2A31; color: #fff; font: 700 16px "Figtree", sans-serif; margin-top: 10px; cursor: pointer; }
.pw-btn.pri { background: #E50914; box-shadow: 0 8px 22px rgba(229,9,20,.35); }
/* iPhone no Safari: seta apontando para o botão Compartilhar na barra de baixo. */
.pw-arrow { position: absolute; left: 50%; bottom: -14px; width: 0; height: 0; margin-left: -12px; border: 12px solid transparent; border-top-color: #16161A; border-bottom: 0; }
#pw-sheet.ios .pw-card { bottom: 18px; left: 10px; right: 10px; border-radius: 22px; padding-bottom: 20px; }
