/* promo pr100: advertising intro slides + access gate */
.promo{min-height:100dvh;display:flex;flex-direction:column;background:#0b1020;color:#fff;position:relative;overflow:hidden}
.promo-top{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;position:relative;z-index:2}
.promo-brand{display:flex;align-items:center;gap:8px;font-weight:900;font-size:16px}
.promo-login{font-size:12.5px;font-weight:800;color:#fff;text-decoration:none;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);padding:8px 18px;border-radius:999px}
.promo-body{flex:1;display:flex;position:relative;z-index:1;padding:6px 18px}
.promo-slide{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;background:var(--pg);border-radius:28px;padding:34px 22px;position:relative;overflow:hidden;box-shadow:0 24px 60px -20px rgba(0,0,0,.5);animation:promoIn .45s ease}
@keyframes promoIn{from{opacity:0;transform:translateY(14px) scale(.98)}}
.promo-orbs i{position:absolute;border-radius:50%;background:rgba(255,255,255,.16);pointer-events:none}
.promo-orbs .po1{width:220px;height:220px;top:-70px;inset-inline-end:-60px}
.promo-orbs .po2{width:130px;height:130px;bottom:-40px;inset-inline-start:-30px}
.promo-orbs .po3{width:70px;height:70px;top:34%;inset-inline-start:12%}
.promo-tag{font-size:11px;font-weight:800;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3);padding:5px 14px;border-radius:999px;position:relative}
.promo-ic{width:96px;height:96px;border-radius:30px;display:grid;place-items:center;background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.4);backdrop-filter:blur(8px);box-shadow:0 14px 30px rgba(0,0,0,.25);position:relative}
.promo-ic svg{width:44px;height:44px}
.promo-slide h2{font-size:24px;font-weight:900;margin:6px 0 0;line-height:1.6;position:relative}
.promo-slide p{font-size:13px;line-height:2;opacity:.93;max-width:340px;position:relative}
.promo-feats{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;position:relative}
.promo-feat{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;background:rgba(0,0,0,.22);padding:6px 12px;border-radius:999px}
.promo-count{font-size:11px;font-weight:800;opacity:.75;position:relative}
.promo-controls{display:flex;align-items:center;gap:10px;padding:14px 18px;position:relative;z-index:2}
.promo-nav{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}
.promo-nav.ph{visibility:hidden}
.promo-dots{flex:1;display:flex;gap:6px;justify-content:center}
.promo-dot{width:8px;height:8px;border-radius:99px;border:none;background:rgba(255,255,255,.3);cursor:pointer;padding:0;transition:all .25s}
.promo-dot.on{width:26px;background:#fff}
.promo-cta{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:#fff;color:#4f46e5;font-weight:900;font-size:14px;text-decoration:none;border:none;cursor:pointer;padding:13px 26px;border-radius:16px;box-shadow:0 10px 24px rgba(0,0,0,.3);flex:none}
.promo-cta.block{width:100%}
.promo-skip{position:absolute;bottom:74px;inset-inline-start:0;right:0;margin-inline:auto;width:max-content;background:none;border:none;color:rgba(255,255,255,.7);font-size:12px;font-weight:700;cursor:pointer;z-index:2}
@media (prefers-reduced-motion:reduce){.promo-slide{animation:none}}
/* gate */
.promo.gate{align-items:center;justify-content:center;padding:20px;background:linear-gradient(160deg,#141a33,#0b1020)}
.gate-card{width:100%;max-width:360px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:26px;padding:28px 22px;display:flex;flex-direction:column;gap:10px;position:relative;z-index:1;backdrop-filter:blur(10px);box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}
.gate-card.shake{animation:gateShake .4s}
@keyframes gateShake{0%,100%{transform:translateX(0)}25%{transform:translateX(7px)}50%{transform:translateX(-7px)}75%{transform:translateX(5px)}}
.gate-logo{width:72px;height:72px;border-radius:24px;display:grid;place-items:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);margin:0 auto}
.gate-card h2{text-align:center;font-size:22px;font-weight:900;margin:0}
.gate-card>p{text-align:center;font-size:12px;opacity:.75;margin:0 0 4px}
.gate-card .field{display:flex;flex-direction:column;gap:6px}
.gate-card .field-label{font-size:12px;font-weight:800;opacity:.85}
.gate-card .input{font:inherit;font-size:15px;color:#fff;background:rgba(255,255,255,.09);border:1.5px solid rgba(255,255,255,.2);border-radius:14px;padding:13px 14px;outline:none;width:100%;box-sizing:border-box}
.gate-card .input:focus{border-color:#8b5cf6;box-shadow:0 0 0 3px rgba(139,92,246,.25)}
.gate-card .field-error{font-size:12px;color:#fda4af;min-height:18px;margin:0;text-align:center}
.gate-card .promo-cta{color:#fff;background:linear-gradient(135deg,#4f46e5,#8b5cf6)}