/* Madame Destino: o modal do Pix (pix.js). As mesmas cores, letras e cartas do site; funciona por cima de qualquer tela. */
.px{position:fixed;inset:0;z-index:60;display:flex;justify-content:center;align-items:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  padding:max(.75rem,env(safe-area-inset-top)) 1rem max(1rem,env(safe-area-inset-bottom));
  background:radial-gradient(circle at 50% 30%,rgba(30,40,92,.97),rgba(5,8,22,.985) 70%);opacity:0;transition:opacity .3s;
  color:var(--papel,#fbf1dc);font-family:'EB Garamond',Georgia,serif;font-size:1.1rem;line-height:1.45;font-variant-numeric:lining-nums;-webkit-font-smoothing:antialiased}
.px[hidden]{display:none}
.px.on{opacity:1}
html.px-trava,html.px-trava body{overflow:hidden}
.px *{box-sizing:border-box}
.px-caixa{position:relative;width:100%;max-width:26rem;margin:auto 0;padding:1.35rem 1.1rem .9rem;border-radius:.9rem;outline:none;
  border:1px solid rgba(217,181,110,.55);background:linear-gradient(180deg,rgba(24,33,78,.97),rgba(9,14,38,.98));
  box-shadow:0 24px 60px rgba(0,0,0,.6),0 0 40px rgba(217,181,110,.12)}
.px-x{position:absolute;top:.35rem;right:.35rem;width:2.75rem;height:2.75rem;border:0;border-radius:50%;background:transparent;color:var(--papel-2,#d6c7a8);font-size:1.1rem;line-height:1;cursor:pointer}
.px-x:hover{color:#fff6e4}
.px-k{margin:0;text-align:center;font-family:Montserrat,sans-serif;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ouro-claro,#f1d9a0)}
.px-t{margin:.25rem 0 0;text-align:center;font-family:'Pinyon',cursive;font-weight:400;font-size:2.45rem;line-height:1.08;color:#fff6e4;text-wrap:balance}
.px-t.px-num{font-family:'EB Garamond',Georgia,serif;font-weight:600;font-size:2.35rem;color:var(--ouro-claro,#f1d9a0)}
.px-sub{margin:.3rem 0 0;text-align:center;color:var(--papel-2,#d6c7a8);font-size:1.02rem;text-wrap:pretty}
.px-sub b{color:#fff6e4;font-weight:600}
.px-preco{font-size:1.45rem;color:var(--ouro-claro,#f1d9a0)!important}
.px-txt{margin:.9rem 0 0;text-align:center;color:#ecdcb8;text-wrap:pretty}

/* botões e campos (o mesmo desenho dos botões do site) */
.px-bt{display:flex;align-items:center;justify-content:center;width:100%;min-height:3.5rem;margin-top:1rem;padding:.3rem 1rem;border:0;border-radius:.5rem;cursor:pointer;text-align:center;
  font:600 1.2rem/1.15 'EB Garamond',Georgia,serif;color:#1a1838;background:linear-gradient(180deg,#f2d999 0%,#d8b062 100%);
  box-shadow:inset 0 0 0 1px rgba(255,240,200,.55),0 10px 26px rgba(0,0,0,.35);-webkit-tap-highlight-color:transparent}
.px-bt:active{transform:translateY(1px)}
.px-bt[disabled]{opacity:.55;cursor:default;transform:none}
.px-bt.sec{color:var(--ouro-claro,#f1d9a0);background:transparent;box-shadow:inset 0 0 0 1.5px var(--ouro,#d9b56e)}
.px-bt.ok{background:linear-gradient(180deg,#d9f2c9,#9fcf8a);color:#10301c}
.px-link{display:block;margin:.55rem auto 0;padding:.45rem .5rem;border:0;background:none;color:var(--papel-2,#d6c7a8);text-decoration:underline;text-underline-offset:.2em;
  font:400 1rem/1.3 'EB Garamond',Georgia,serif;cursor:pointer;text-align:center}
.px-campos{display:grid;gap:.6rem;margin-top:1rem}
.px-campo{display:block}
.px-campo span{display:block;margin:0 0 .2rem .1rem;font-size:.95rem;color:var(--papel-2,#d6c7a8)}
.px-campo input{width:100%;min-height:3.2rem;padding:.45rem .85rem;border-radius:.5rem;border:1px solid rgba(217,181,110,.6);background:rgba(7,12,34,.6);color:#fff6e4;
  font:400 1.25rem/1.2 'EB Garamond',Georgia,serif;font-size:max(16px,1.25rem)}
.px-campo input::placeholder{color:rgba(214,199,168,.45)}
.px-campo input:focus{outline:none;border-color:var(--ouro-claro,#f1d9a0);box-shadow:0 0 0 3px rgba(241,217,160,.2)}
.px-dica{margin:.45rem 0 0;font-size:.92rem;font-style:italic;color:var(--papel-2,#d6c7a8);text-align:center}
.px-erro{margin:.6rem 0 0;color:#ffc2b0;font-size:1rem;text-align:center}
.px-erro:empty{display:none}
.px-casal{display:grid;gap:.6rem;margin-top:1rem}
.px-pessoa{margin:0;padding:.55rem .7rem .7rem;border:1px solid rgba(217,181,110,.35);border-radius:.5rem;display:grid;grid-template-columns:1.25fr 1fr;gap:.5rem}
.px-pessoa legend{padding:0 .3rem;font-size:.85rem;color:var(--ouro-claro,#f1d9a0)}
.px-pessoa input{min-height:2.9rem;font-size:max(16px,1.1rem)}

/* o que vem: exatamente */
.px-leque{position:relative;height:4.6rem;width:6rem;margin:.8rem auto 0}
.px-leque .cv{position:absolute;left:50%;bottom:0;width:2.7rem;transform-origin:50% 120%;transform:translateX(-50%)}
.px-leque .cv:nth-child(1){transform:translateX(-50%) rotate(-15deg)}
.px-leque .cv:nth-child(3){transform:translateX(-50%) rotate(15deg)}
.px-recebe{margin-top:.9rem;padding:.8rem .95rem .85rem;border-radius:.6rem;border:1px solid rgba(241,217,160,.6);
  background:radial-gradient(120% 140% at 50% 0%,rgba(217,181,110,.18),rgba(7,12,34,.45) 70%)}
.px-recebe b{display:block;font-weight:600;color:#fff6e4;font-size:1.08rem}
.px-recebe ul{margin:.35rem 0 0;padding:0;list-style:none}
.px-recebe li{position:relative;margin-top:.25rem;padding-left:1.25rem;color:#ecdcb8;line-height:1.35;text-wrap:pretty}
.px-recebe li:before{content:'✦';position:absolute;left:0;top:.05rem;color:var(--ouro-claro,#f1d9a0);font-size:.85rem}
.px-recebe small{display:block;margin-top:.5rem;font-style:italic;color:var(--papel-2,#d6c7a8);font-size:.92rem}

/* o Pix */
.px-espera{display:flex;align-items:center;justify-content:center;gap:.55rem;margin:.85rem 0 0;font-style:italic;color:var(--ouro-claro,#f1d9a0);text-align:center;min-height:1.6rem}
.px-espera.alerta{color:#ffd3a8}
.px-giro{flex:none;width:1.05rem;height:1.05rem;border-radius:50%;border:2px solid rgba(241,217,160,.25);border-top-color:#f1d9a0;animation:pxGira .9s linear infinite}
.px-espera.alerta .px-giro{border-top-color:#ffd3a8}
@keyframes pxGira{to{transform:rotate(360deg)}}
.px-passos{margin:.8rem 0 0;padding:.7rem .9rem .7rem 2.1rem;border-radius:.55rem;background:rgba(7,12,34,.5);border:1px solid rgba(217,181,110,.3);color:#ecdcb8;font-size:1rem;line-height:1.35}
.px-passos li{margin:.15rem 0}
.px-passos b{color:#fff6e4;font-weight:600}
.px-qr{margin:1rem 0 0;text-align:center}
.px-qr img{display:block;width:min(56vw,12.5rem);height:auto;margin:0 auto;padding:.55rem;background:#fff;border-radius:.6rem;box-shadow:0 0 0 1px rgba(217,181,110,.6),0 10px 26px rgba(0,0,0,.4);image-rendering:pixelated}
.px-qr figcaption{margin-top:.45rem;font-size:.9rem;font-style:italic;color:var(--papel-2,#d6c7a8)}
.px-cod{margin-top:.7rem;text-align:center}
.px-cod summary{cursor:pointer;color:var(--papel-2,#d6c7a8);font-size:.95rem}
.px-cod textarea{width:100%;margin-top:.45rem;padding:.5rem;border-radius:.4rem;border:1px solid rgba(217,181,110,.45);background:rgba(7,12,34,.7);color:#f6ead0;
  font:400 .8rem/1.3 ui-monospace,Menlo,Consolas,monospace;word-break:break-all;resize:none}

/* liberado: as cartas viram, uma a uma */
.px-festa .px-t{font-size:2.7rem;animation:pxBrota .7s cubic-bezier(.2,.9,.3,1.25) both}
@keyframes pxBrota{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
.px-revela{position:relative;height:9.6rem;margin:1rem auto .2rem;max-width:22rem}
.px-revela:before{content:'';position:absolute;left:50%;top:58%;width:19rem;aspect-ratio:1;transform:translate(-50%,-50%) scale(.4);border-radius:50%;pointer-events:none;opacity:0;
  background:radial-gradient(circle,rgba(255,231,170,.5),rgba(217,181,110,.16) 40%,rgba(217,181,110,0) 68%);transition:transform 1.2s cubic-bezier(.2,.8,.2,1),opacity 1s}
.px-revela.brilha:before{opacity:1;transform:translate(-50%,-50%) scale(1)}
.px-revela .px-c{position:absolute;left:50%;bottom:.2rem;width:3.9rem;transform-origin:50% 150%;
  transform:translateX(-50%) rotate(calc((var(--i) - (var(--t,1) - 1) / 2) * 6.5deg));animation:pxSobe .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 55ms)}
.px-revela .px-c .cv{box-shadow:0 .5rem 1rem rgba(0,0,0,.55),0 0 0 1px rgba(217,181,110,.7)}
.px-revela.brilha .px-c .cv{box-shadow:0 .5rem 1rem rgba(0,0,0,.55),0 0 0 1px rgba(241,217,160,.95),0 0 14px rgba(241,217,160,.45)}
@keyframes pxSobe{from{opacity:0;transform:translateX(-50%) translateY(30%) rotate(0deg) scale(.8)}}
.px-revela.um{height:auto;display:flex;justify-content:center}
.px-revela.um .px-c{position:relative;left:auto;bottom:auto;width:min(46vw,11rem);transform:none;animation:pxSobe1 .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes pxSobe1{from{opacity:0;transform:translateY(16px) scale(.9)}}
.px-cvt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2cqw;padding:8cqw;text-align:center;background:radial-gradient(circle at 50% 42%,#22306a,#0a1130 72%)}
.px-cvt b{font-family:'Pinyon',cursive;font-weight:400;font-size:13cqw;line-height:1.05;color:#f6dda2}
.px-cvt span{font-style:italic;font-size:7cqw;color:#efe0bf}
.px-lista{margin:.9rem 0 0;padding:0;list-style:none;text-align:center;color:#ecdcb8}
.px-lista li{margin-top:.2rem}
.px-lista li:before{content:'✦ ';color:var(--ouro-claro,#f1d9a0)}

/* o link mágico */
.px-magico{margin-top:1.1rem;padding:.85rem .9rem .9rem;border-radius:.6rem;text-align:center;border:1px solid rgba(241,217,160,.7);
  background:radial-gradient(120% 140% at 50% 0%,rgba(217,181,110,.22),rgba(7,12,34,.5) 70%);box-shadow:0 0 26px rgba(217,181,110,.16)}
.px-magico > b{display:block;font-family:'Pinyon',cursive;font-weight:400;font-size:1.75rem;line-height:1.1;color:var(--ouro-claro,#f1d9a0)}
.px-url{margin:.35rem 0 0;padding:.4rem .6rem;border-radius:.4rem;background:rgba(7,12,34,.65);border:1px dashed rgba(217,181,110,.5);color:#f6ead0;
  font:400 .88rem/1.3 ui-monospace,Menlo,Consolas,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.px-duas{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
.px-duas .px-bt{min-height:3rem;margin-top:.6rem;font-size:1.05rem}
.px-magico small{display:block;margin-top:.55rem;font-size:.95rem;line-height:1.35;font-style:italic;color:#fff1cc}

/* o rodapé de confiança */
.px-pe{margin:1rem 0 0;padding-top:.7rem;border-top:1px solid rgba(217,181,110,.22);text-align:center;font-family:Montserrat,sans-serif;font-size:.66rem;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(214,199,168,.85)}
.px-aviso{position:fixed;left:50%;bottom:max(1.1rem,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:70;max-width:calc(100vw - 2rem);padding:.75rem 1.1rem;
  border-radius:.45rem;background:#fff3d6;color:#1a1838;font:400 1.02rem/1.3 'EB Garamond',Georgia,serif;box-shadow:0 12px 30px rgba(0,0,0,.45);text-align:center}
.px-aviso[hidden]{display:none}

@media (min-width:600px){.px{align-items:center}.px-caixa{padding:1.6rem 1.5rem 1rem}}
@media (prefers-reduced-motion:reduce){
  .px,.px-revela:before{transition:none}
  .px-giro,.px-festa .px-t,.px-revela .px-c,.px-revela.um .px-c{animation:none}
}
