/* páginas autónomas: convite, porta, painel */
body.inv{min-height:100vh;min-height:100dvh;background:#0a0e2c;display:flex;justify-content:center}
.invcol{position:relative;width:min(430px,100%);min-height:100vh;min-height:100dvh;padding:44px 24px 20px;display:flex;flex-direction:column;align-items:center;text-align:center;background:
  radial-gradient(2px 2px at 20% 8%,rgba(255,255,255,.7) 50%,transparent 51%),
  radial-gradient(1.5px 1.5px at 78% 16%,rgba(255,255,255,.6) 50%,transparent 51%),
  radial-gradient(2px 2px at 64% 71%,rgba(255,255,255,.45) 50%,transparent 51%),
  radial-gradient(1.5px 1.5px at 12% 84%,rgba(255,255,255,.5) 50%,transparent 51%),
  radial-gradient(520px 380px at 50% 0,#232b78 0,transparent 70%),linear-gradient(180deg,#141a4a,#0a0e2c)}
body.inv.red .invcol{background:
  radial-gradient(3px 3px at 18% 6%,#fff 50%,transparent 51%),radial-gradient(2px 2px at 30% 13%,#fff 50%,transparent 51%),
  radial-gradient(3px 3px at 82% 9%,#fff 50%,transparent 51%),radial-gradient(2px 2px at 70% 26%,rgba(255,255,255,.8) 50%,transparent 51%),
  radial-gradient(2.5px 2.5px at 8% 58%,rgba(255,255,255,.8) 50%,transparent 51%),radial-gradient(2px 2px at 92% 70%,rgba(255,255,255,.7) 50%,transparent 51%),
  radial-gradient(2px 2px at 50% 93%,rgba(255,255,255,.6) 50%,transparent 51%),
  radial-gradient(520px 380px at 50% 0,#232b78 0,transparent 70%),linear-gradient(180deg,#141a4a,#0a0e2c)}
.invcol .aboard{font-size:40px}
.invcol .rail{width:240px}
.invcol .kicker{font-size:12px}
.invcol .tk{margin-top:26px;padding:20px 22px;gap:14px}
.invcol .tk b{font-size:18px}
.invcol .motto{font-size:20px;margin:22px 0}
.invcol .pbtn{max-width:280px;min-height:54px;font-size:15px;margin-top:auto}
body.inv.red .pbtn{background:linear-gradient(180deg,#f04a56,#cf2a37);color:#fff}
.invcol .bigmsg{margin:auto 0}
.invcol .bigmsg h4{font-size:24px}
.invcol .bigmsg p{font-size:16.5px;max-width:28ch}
.invcol .gticket{margin-top:20px;padding:22px 20px 18px}
.invcol .gticket .aboard{font-size:32px}
.invcol .gf b{font-size:17px}
.invcol .qr{width:210px;height:210px;margin:16px auto 8px}
.invcol .toy{font-size:14px;margin-top:18px}
.invfoot{margin-top:22px;font-size:11.5px;color:rgba(255,255,255,.5);line-height:1.5}
.invfoot a,.invfoot button{color:rgba(255,255,255,.7);background:none;border:0;font:inherit;text-decoration:underline;cursor:pointer;padding:6px 2px}
.dots{display:inline-flex;gap:6px;margin-top:6px}
.dots i{width:7px;height:7px;border-radius:50%;background:var(--gold);animation:dot 1.2s infinite ease-in-out}
.dots i:nth-child(2){animation-delay:.2s}.dots i:nth-child(3){animation-delay:.4s}
@keyframes dot{0%,80%,100%{opacity:.25}40%{opacity:1}}

body.gate{min-height:100vh;min-height:100dvh;background:#0b0b0b;display:flex;justify-content:center}
.gatecol{width:min(480px,100%);min-height:100vh;min-height:100dvh;padding:18px 16px 16px;display:flex;flex-direction:column}
.gatehead{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 14px;border-bottom:1px solid #262626}
.gatehead img{height:22px;width:auto}
.gatehead span{font-family:"Barlow Condensed",sans-serif;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--s3)}
.pinbox{margin:auto 0;display:grid;gap:16px;justify-items:center;text-align:center}
.pinbox h1{font-size:40px}
.pinbox p{color:var(--s3)}
.pinbox input{width:200px;min-height:60px;text-align:center;font-size:30px;letter-spacing:.4em;background:#151515;border:1px solid #3a3a3a;color:#fff;border-radius:6px;font-family:"Barlow Condensed",sans-serif}
.pinbox .btn{width:200px}
.pinbox small{color:var(--s4)}
.pinerr{color:var(--bad);min-height:22px;font-size:15px}
.gseg{display:flex;margin-top:12px;border:1px solid var(--line);padding:4px;gap:4px}
.gseg button{flex:1;border:0;background:transparent;color:var(--s3);font-family:"Barlow Condensed",sans-serif;font-size:15px;letter-spacing:.12em;text-transform:uppercase;min-height:42px;cursor:pointer}
.gseg button[aria-selected="true"]{background:var(--s1);color:var(--ink)}
.cam{position:relative;width:100%;aspect-ratio:1/1;max-height:46vh;margin-top:12px;background:#151515;border-radius:16px;overflow:hidden;display:grid;place-items:end center}
.cam video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cam .frame{position:absolute;inset:14% 14%;border:2px solid rgba(255,255,255,.8);border-radius:16px;box-shadow:0 0 0 600px rgba(0,0,0,.3)}
.cam .frame::after{content:"";position:absolute;left:8px;right:8px;top:50%;height:2px;background:var(--gold);animation:scan2 2.2s ease-in-out infinite}
@keyframes scan2{0%,100%{transform:translateY(-90px)}50%{transform:translateY(90px)}}
.cam p{position:relative;z-index:2;font-size:13px;color:#eee;padding:10px}
.cam.paused .frame::after{display:none}
.gres{margin-top:12px;border-radius:14px;padding:18px 18px;color:#0b0b0b}
.gres.ok{background:var(--ok)}.gres.warn{background:var(--warn)}.gres.bad{background:var(--bad);color:#fff}
.gres small{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.2em;font-size:13px;display:block;font-weight:600}
.gres b{font-size:28px;display:block;line-height:1.1;margin:4px 0 6px}
.gres span{font-size:16px}
.gbtns{display:grid;gap:8px;margin-top:12px}
.gbtns .btn{width:100%;min-height:54px}
.gsearch{margin-top:14px}
.gsearch input{width:100%;min-height:48px;background:#151515;border:1px solid #333;color:#fff;padding:0 14px;font:inherit;font-size:16px;border-radius:6px}
.gsearch ul{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:6px}
.gsearch li{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#151515;border:1px solid #2a2a2a;border-radius:6px;padding:8px 10px 8px 14px;font-size:15.5px}
.gsearch li small{display:block;color:var(--s4);font-size:13px}
.gcount{margin-top:auto;padding-top:16px;text-align:center;color:var(--s4);font-size:13.5px}

body.pnl{background:var(--ink)}
.pnlwrap{width:min(1180px,100% - 32px);margin:0 auto;padding:22px 0 60px}
.pnlhead{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;margin-bottom:18px}
.pnlhead .brand img{height:26px}
.pnlhead h1{font-size:30px}

.launch{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:36px}
@media(max-width:900px){.launch{grid-template-columns:1fr}}
.launch a{display:flex;flex-direction:column;gap:12px;border:1px solid var(--line);background:linear-gradient(180deg,#1a1a1a,#111);padding:26px 24px;text-decoration:none;transition:border-color .2s,transform .2s}
.launch a:hover{border-color:var(--s1);transform:translateY(-2px)}
.launch span{font-family:"Barlow Condensed",sans-serif;font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.launch p{color:var(--s3);font-size:16px;flex:1}
.launch em{font-style:normal;font-family:"Barlow Condensed",sans-serif;letter-spacing:.14em;text-transform:uppercase;font-size:15px;border-bottom:1px solid var(--s4);align-self:flex-start;padding-bottom:2px}
.phoneqr{display:flex;flex-wrap:wrap;gap:22px;align-items:center;margin-top:22px;border:1px solid var(--gold2);background:rgba(226,183,87,.07);padding:20px 22px}
.phoneqr .qr{margin:0;width:128px;height:128px;flex:none}
.phoneqr div:last-child{flex:1 1 280px}
.phoneqr b{display:block;font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:21px;margin-bottom:6px}
.phoneqr p{color:var(--s2);font-size:16px}

.invfoot .credit{display:inline-block;margin-bottom:8px;font-size:12px}
.gatecol .credit{font-size:12px}

[hidden]{display:none!important}