/* Tela de login (/entrar). A marcação vem de studio/src/index.js; aqui só o estilo, na linguagem da vitrine. */
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-display:swap;font-weight:200 800;src:url(/fontes/bricolage-grotesque-latin-wght-normal.woff2) format("woff2-variations")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-display:swap;font-weight:400;src:url(/fontes/ibm-plex-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-display:swap;font-weight:600;src:url(/fontes/ibm-plex-sans-latin-600-normal.woff2) format("woff2")}
:root{--papel:#fdf9f2;--tinta:#17130f;--tinta2:#4a4440;--tinta3:#81786f;--linha:#eee3d1;--sol:#ffc414;--laranja:#ff8c00;--brasa:#e85d04;
  --assina:linear-gradient(100deg,var(--sol) 0%,var(--laranja) 52%,var(--brasa) 100%)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px 16px;background:var(--papel);color:var(--tinta);font:16px/1.5 "IBM Plex Sans",ui-sans-serif,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip;position:relative}
body::before,body::after{content:"";position:fixed;z-index:-1;border-radius:50%;filter:blur(70px);pointer-events:none}
body::before{width:60vmax;height:60vmax;left:-20vmax;top:-26vmax;background:var(--sol);opacity:.5;animation:vaga1 22s ease-in-out infinite alternate}
body::after{width:50vmax;height:50vmax;right:-22vmax;bottom:-24vmax;background:var(--laranja);opacity:.32;animation:vaga2 26s ease-in-out infinite alternate}
@keyframes vaga1{to{transform:translate(14vw,12vh) scale(1.12)}}
@keyframes vaga2{to{transform:translate(-16vw,-14vh) scale(.88)}}
.entrar{width:min(400px,100%);text-align:center;padding:36px 28px 32px;border-radius:32px;background:rgba(255,255,255,.72);border:1px solid var(--linha);box-shadow:0 30px 60px -36px rgba(232,93,4,.45);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:surge .9s cubic-bezier(.22,1,.36,1) both}
@keyframes surge{from{opacity:0;transform:translateY(20px);filter:blur(8px)}}
.logo{height:42px;width:auto;display:block;margin:0 auto}
h1{font-family:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;font-weight:800;font-size:34px;letter-spacing:-.045em;line-height:1;margin:28px 0 10px;text-wrap:balance}
p{color:var(--tinta2);margin:0;font-size:15.5px}
form{display:flex;flex-direction:column;gap:10px;margin-top:24px}
input{height:54px;padding:0 20px;border:1px solid var(--linha);border-radius:999px;font:inherit;font-size:17px;text-align:center;letter-spacing:.04em;color:var(--tinta);background:var(--papel);outline:none;transition:border-color .2s,background .2s}
input::placeholder{color:var(--tinta3);letter-spacing:0}
input:focus{border-color:var(--laranja);background:#fff}
button{position:relative;isolation:isolate;overflow:hidden;height:54px;border:0;border-radius:999px;font:inherit;font-size:16px;font-weight:600;color:var(--tinta);background:var(--assina);box-shadow:0 10px 30px -8px rgba(255,140,0,.65),0 2px 0 rgba(255,255,255,.5) inset;cursor:pointer;transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s}
button::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.65) 50%,transparent 65%);transform:translateX(-120%);animation:varre 3.4s ease-in-out infinite}
@keyframes varre{55%,100%{transform:translateX(120%)}}
button:hover{transform:translateY(-2px);box-shadow:0 16px 38px -8px rgba(232,93,4,.6),0 2px 0 rgba(255,255,255,.5) inset}
button:active{transform:scale(.97)}
:focus-visible{outline:2.5px solid var(--brasa);outline-offset:3px}
.erro{margin-top:14px;padding:10px 14px;border-radius:14px;background:#fbeceb;color:#b4443c;font-size:14px;font-weight:600}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}