html,body{margin:0;background:#07080a;color:#fff;font-family:'Poppins',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
#gl3d{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:0;background:#131518}
.sem-webgl #gl3d{background:radial-gradient(ellipse at 50% 30%,#2a2d33,#07080a 70%)}
.m3-run{position:relative;height:600vh;pointer-events:none}
.m3-vig{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 50%,rgba(0,0,0,.5) 100%),linear-gradient(180deg,rgba(0,0,0,.35),transparent 22%,transparent 62%,rgba(0,0,0,.55))}
.m3-hud{position:fixed;inset:0;z-index:2;pointer-events:none;padding:max(18px,env(safe-area-inset-top)) 20px max(22px,env(safe-area-inset-bottom));transition:opacity .5s}
body.m3-fim .m3-hud{opacity:0}
.m3-brand{font:500 12px/1 'Poppins',sans-serif;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.85);max-width:70vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m3-bar{position:absolute;right:20px;top:90px;bottom:90px;width:2px;background:rgba(255,255,255,.14);border-radius:2px;overflow:hidden}
.m3-bar i{position:absolute;inset:0;background:#fff;transform-origin:top;transform:scaleY(0)}
.m3-card{position:absolute;left:20px;right:48px;bottom:max(28px,env(safe-area-inset-bottom));max-width:720px;opacity:0;transform:translateY(14px);transition:opacity .45s,transform .45s}
.m3-card.on{opacity:1;transform:none}
.m3-k{font:500 10px/1 'Poppins',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:12px}
.m3-t{margin:0 0 14px;font:400 clamp(26px,7.4vw,58px)/1 'Archivo Black','Anton','Arial Black',sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.6)}
.m3-t span{display:block}
.m3-p{margin:0;max-width:330px;font:400 12.5px/1.55 'Poppins',sans-serif;color:rgba(255,255,255,.8);padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
/* final: login + criador */
.m3-final{position:relative;z-index:3;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:40px 16px max(40px,env(safe-area-inset-bottom))}
.m3-login.lp-modal{position:relative;inset:auto;z-index:auto;display:block;padding:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;opacity:1;visibility:visible;overflow:visible;width:min(430px,100%)}
.m3-login .lp-box{width:100%;opacity:0;transform:translateY(60px) scale(.94);filter:blur(10px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1),filter .9s}
.m3-login .lp-box.m3-in{opacity:1;transform:none;filter:none}
.m3-login .face{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.m3-cr{width:min(430px,100%);border-radius:22px;overflow:hidden;background:rgba(14,14,14,.55);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;transform:translateY(30px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}
.m3-cr.m3-in{opacity:1;transform:none}
.m3-cr .cr-ban{height:64px;position:relative;overflow:hidden}
.m3-cr .cr-body{margin-top:-30px;padding:0 16px}
.m3-cr .cr-av{width:64px;height:64px;font-size:20px;border-width:3px}
.m3-cr p{margin:8px 16px 16px;font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.75)}
@media(min-width:900px){.m3-hud{padding-left:44px;padding-right:44px}.m3-bar{right:44px}.m3-card{left:44px;bottom:48px}.m3-p{font-size:14px;max-width:420px}}
@media(prefers-reduced-motion:reduce){.m3-card,.m3-login .lp-box,.m3-cr{transition:none}}