*{box-sizing:border-box}
body{margin:0;height:100vh;display:grid;place-items:center;background:linear-gradient(#03101b19,#03101b27),url("/marca/fundo.png") center/cover;font:16px -apple-system,BlinkMacSystemFont,Arial,sans-serif;color:#eff4ff}
main{width:378px;padding:32px 38px 36px;border-radius:22px;background:linear-gradient(145deg,#122334f5,#07111cf5);border:1px solid #65839b75;box-shadow:0 24px 70px #0008}
img{display:block;width:246px;margin:0 auto 28px}
h1{font-size:27px;letter-spacing:-.8px;margin:0 0 24px}
label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
input{background:#091521;border:1px solid #435364;border-radius:8px;font:15px Arial;color:white;width:100%;height:46px;padding:0 13px;margin-bottom:18px}
input::placeholder{color:#9caaba}
button{width:100%;height:46px;background:#abef39;border:none;border-radius:8px;color:#102300;font-size:16px;font-weight:700}
main{width:392px;position:relative;isolation:isolate;overflow:hidden;padding:34px 39px;background:linear-gradient(137deg,#b4f4ff28,#08192a62 35%,#14354c50 65%,#83efbd29);backdrop-filter:blur(15px);border:1px solid #abf4ff81;box-shadow:inset 1px 1px 3px #c8ffff80,inset -1px -1px 3px #aaff7755,0 12px 60px #0006}
main:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,#d2f7ff26,transparent 65%);clip-path:polygon(0 0,38% 0,11% 15%,0 41%)}
main:after{content:"";z-index:-1;position:absolute;inset:0;background:linear-gradient(130deg,transparent 70%,#99edff42);clip-path:polygon(100% 54%,100% 100%,75% 100%,94% 82%)}
.cracks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}
main img{width:253px;margin-bottom:28px}
label{text-shadow:0 1px 5px #00101f}
 .field{position:relative}
.icon{position:absolute;top:9px;left:11px;width:28px;height:28px;filter:drop-shadow(0 0 4px #37caff47)}
input{padding-left:49px;background:#041522aa;border-color:#8bcbd55c}
button{background:linear-gradient(105deg,#cbfc05,#cbfc05 70%,#07cd01);box-shadow:0 0 18px #8bfb3628}
main{background:linear-gradient(135deg,rgba(0,154,253,.17),rgba(2,12,22,.56) 48%,rgba(7,205,1,.12));border-color:#009afd66}

body{min-height:100svh;height:auto;box-sizing:border-box;padding:20px;background-color:#03101b}
main{width:min(392px,100%);overflow:visible}
main img{max-width:100%;height:auto}
main:before,main:after{border-radius:22px;pointer-events:none}
.cracks{overflow:hidden;border-radius:22px}
.edge{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.edge rect{fill:none;stroke-width:2;stroke-dasharray:10 90;animation:orbit 4s linear infinite;filter:drop-shadow(0 0 4px currentColor)}
.edge .lime{stroke:#cbfc05;color:#cbfc05}
.edge .blue{stroke:#009afd;color:#009afd;animation-delay:-2s}
@keyframes orbit{to{stroke-dashoffset:-100}}
@media(prefers-reduced-motion:reduce){.edge rect{animation-play-state:paused}}
button{cursor:pointer}
input:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #009afd;outline-offset:3px}
.plain{padding-left:12px}
.secondary{background:transparent;color:#fff;box-shadow:none;text-decoration:underline;margin-top:8px}
.error{color:#ffe4d6;padding:10px;background:#302128;border-radius:6px}
dialog{border:0;padding:0;background:transparent;color:inherit;width:min(392px,calc(100% - 40px));max-height:95svh;overflow:auto;border-radius:22px}
dialog main{width:100%}
dialog::backdrop{background:rgba(2,12,22,.28)}
a{color:#fff}