/* A Cadeira — cadastro e entrar. Tokens em /assets/css/tokens.css (não redefinir). Motion só no bloco final. */
html{color-scheme:dark}
body{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:radial-gradient(110% 60% at 75% 0%,rgba(242,178,92,.13),transparent 62%),linear-gradient(180deg,#111a2d 0%,var(--noite) 55%,#0a0f1b 100%)}
h1,p,fieldset,legend{margin:0;padding:0}
fieldset{border:0;min-width:0}
a{color:inherit}
[hidden]{display:none!important}
:where(button,input){font:inherit;color:inherit}
.skip{position:absolute;left:1rem;top:-5rem;z-index:99;background:var(--toalha);color:var(--tinta);padding:.7rem 1rem;font-weight:700}
.skip:focus{top:1rem}

/* verga */
.lintel{position:sticky;top:0;z-index:40;background:rgba(10,13,22,.94);border-bottom:1px solid var(--linha);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.lintel::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:repeating-linear-gradient(90deg,var(--polo-r) 0 14px,#f4f0e6 0 20px,var(--polo-b) 0 34px,#f4f0e6 0 40px);opacity:.9}
.lintel__in{display:flex;align-items:center;gap:1rem;width:min(100% - 2rem,68rem);min-height:3.5rem;margin-inline:auto}
.brand{display:flex;align-items:center;gap:.65rem;min-height:2.75rem;text-decoration:none}
.lintel__link{display:inline-flex;align-items:center;min-height:2.75rem;margin-left:auto;font-weight:700;font-size:.9rem;color:var(--ambar);text-underline-offset:.25em}
.pole--mini{display:inline-flex;flex:none;width:10px;height:26px}
.pole--mini i{flex:1;border-block:3px solid #b9bdc4;border-image:linear-gradient(90deg,#5f646d,#f3f4f6 34%,#9aa0a9 58%,#3d424b) 1;background:linear-gradient(90deg,rgba(0,0,0,.45),rgba(255,255,255,.5) 30%,rgba(255,255,255,0) 56%,rgba(0,0,0,.5)),linear-gradient(135deg,var(--polo-r) 0 12.5%,#f4f0e6 0 25%,var(--polo-b) 0 37.5%,#f4f0e6 0 50%,var(--polo-r) 0 62.5%,#f4f0e6 0 75%,var(--polo-b) 0 87.5%,#f4f0e6 0);background-size:100% 100%,20px 20px}

/* palco */
.conta{flex:1;display:grid;align-items:center;gap:2.5rem;width:min(100% - 2rem,68rem);margin-inline:auto;padding:1.6rem 0 2.5rem}
.cena{display:none}
.ficha{position:relative;width:min(100%,29rem);margin-inline:auto;padding:1.5rem 1.25rem 1.4rem;border-radius:var(--r1);background:linear-gradient(160deg,#1b2742,var(--noite) 70%);box-shadow:inset 0 0 0 5px #0a101c,inset 0 0 0 6px rgba(236,231,221,.3),inset 0 0 0 7px rgba(0,0,0,.5),0 30px 50px -28px #000}
.plaque{position:relative;z-index:2;width:fit-content;max-width:100%;margin:1.9rem auto 1.5rem;padding:.6rem .95rem;border-radius:2px;background:linear-gradient(175deg,#fffdf6,var(--toalha) 60%,#ebe4d4);color:var(--tinta);font-size:.8125rem;line-height:1.35;text-align:center;box-shadow:0 14px 30px rgba(0,0,0,.45),0 2px 0 rgba(0,0,0,.25),inset 0 0 0 4px var(--toalha),inset 0 0 0 5px rgba(16,21,31,.5);transform-origin:50% -26px;transform:rotate(-1.2deg)}
.plaque::before{content:"";position:absolute;left:50%;top:-18px;width:36px;height:36px;margin-left:-18px;border-left:1px solid rgba(236,231,221,.6);border-top:1px solid rgba(236,231,221,.6);transform:rotate(45deg)}
.plaque::after{content:"";position:absolute;left:50%;top:-29px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe2ad,var(--ambar) 55%,#9c6a25)}
.plaque strong{font-stretch:78%;letter-spacing:.14em;text-transform:uppercase;font-weight:800}
.eyebrow{margin-bottom:.6rem;color:var(--ambar)}
.titulo{font:400 clamp(2.3rem,10vw,3.1rem)/.95 var(--disp);letter-spacing:-.01em;text-shadow:0 2px 0 rgba(0,0,0,.35)}
.neon{display:block;width:fit-content;font:400 .72em/1.05 var(--script);letter-spacing:0;color:var(--brasa);transform:rotate(-4deg);transform-origin:0 100%;margin:.14em 0 .1em .05em;padding-right:.15em;white-space:nowrap;text-shadow:0 0 22px rgba(238,108,59,.55),0 0 6px rgba(238,108,59,.45),0 0 1px rgba(255,214,180,.9)}
.strop{height:8px;margin:1.1rem 0 1.25rem;border-radius:4px;background:rgba(236,231,221,.12);overflow:hidden}
.strop i{display:block;width:calc(var(--p,0)*100%);height:100%;border-radius:inherit;background:repeating-linear-gradient(-45deg,var(--polo-r) 0 6px,#f4f0e6 0 10px,var(--polo-b) 0 16px,#f4f0e6 0 20px)}
.sem-barra{margin-top:1.2rem}

/* formulário */
.step{display:grid;gap:.95rem}
.js .step:not(.is-on){display:none}
.field{display:grid;gap:.35rem;min-width:0}
.field label{font:700 .74rem/1.2 var(--sans);font-stretch:80%;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-2)}
.field input{width:100%;min-height:3.1rem;padding:.65rem .8rem;border:1px solid var(--linha-forte);border-radius:var(--r2);background:rgba(10,13,22,.6);font-size:1rem}
.field input::placeholder{color:var(--texto-3);opacity:1}
.field input:focus-visible{outline-offset:1px;border-color:var(--ambar)}
.field input[aria-invalid=true]{border-color:var(--erro)}
.field input:-webkit-autofill{-webkit-text-fill-color:var(--porcelana);box-shadow:0 0 0 99px #131c2e inset;caret-color:var(--porcelana)}
.field__hint{font-size:.82rem;color:var(--texto-3)}
.field__hint[data-state=ok]{color:#8fd6b1}
.field__hint[data-state=taken],.field__hint[data-state=invalid]{color:#ff9b9e}
.field__err{font-size:.86rem;font-weight:600;color:#ff9b9e}
.senha{position:relative}
.senha input{padding-right:5.8rem}
.senha button{position:absolute;right:.2rem;top:50%;translate:0 -50%;min-width:2.75rem;min-height:2.75rem;padding:0 .7rem;border:0;background:none;color:var(--ambar);font-weight:700;font-size:.82rem;cursor:pointer}
.forca{height:6px;border-radius:3px;background:rgba(236,231,221,.12);overflow:hidden}
.forca i{display:block;width:calc(var(--p,0)*100%);height:100%;background:var(--erro)}
.forca[data-n="2"] i{background:var(--aviso)}
.forca[data-n="3"] i,.forca[data-n="4"] i{background:var(--ok)}
.slugline{display:flex;align-items:center;border:1px solid var(--linha-forte);border-radius:var(--r2);background:rgba(10,13,22,.6);overflow:hidden}
.slugline>span{padding-left:.8rem;color:var(--texto-3);font-size:.86rem;white-space:nowrap}
.slugline input{flex:1;min-width:5rem;border:0;background:none;padding-left:.1rem;font-weight:700;color:var(--ambar)}
.slugline input:focus-visible{outline:0}
.slugline:focus-within{border-color:var(--ambar);outline:3px solid var(--focus);outline-offset:1px}
.sugestao{width:fit-content;min-height:2.75rem;padding:.4rem .9rem;border:0;border-radius:99px;background:rgba(242,178,92,.16);color:var(--ambar);font-weight:700;cursor:pointer}
.linkprev{display:grid;gap:.25rem;padding:.7rem .9rem;border-radius:2px;background:linear-gradient(175deg,#fffdf6,var(--toalha) 60%,#ebe4d4);color:var(--tinta);font-size:.95rem;overflow-wrap:anywhere;rotate:-.6deg;box-shadow:var(--sombra)}
.linkprev .label{color:var(--corten)}
.linkprev strong{font-weight:800}
.aceite{display:flex;align-items:flex-start;gap:.7rem;min-height:2.75rem;font-size:.92rem;color:var(--texto-2);cursor:pointer}
.aceite input{flex:none;width:1.35rem;height:1.35rem;margin:.1rem 0 0;accent-color:var(--brasa)}
.aceite a{color:var(--porcelana);font-weight:700;text-underline-offset:.2em}
.hp{position:absolute;left:-200vw;width:1px;height:1px;overflow:hidden}
.acoes{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.3rem}
.acoes .btn{flex:1 1 9rem}
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3.3rem;padding:.85rem 1.35rem;border:0;border-radius:var(--r1);background:var(--brasa);color:var(--tinta);font:700 .92rem/1.1 var(--sans);font-stretch:80%;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;text-align:center;box-shadow:0 10px 22px -12px rgba(238,108,59,.8);cursor:pointer}
.btn::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 36%,rgba(255,255,255,.5) 50%,transparent 64%);translate:-110% 0;pointer-events:none}
.btn::after{content:"";position:absolute;inset:4px;border:1px solid currentColor;border-radius:1px;opacity:.4;pointer-events:none}
.btn:active{transform:translateY(1px) scale(.985)}
.btn--ghost{background:transparent;color:var(--porcelana);box-shadow:inset 0 0 0 1px rgba(236,231,221,.6)}
.btn--ghost::after{display:none}
.btn:disabled,.btn[aria-busy=true]{opacity:.55;cursor:not-allowed}
.alerta,.aviso{margin-top:.9rem;padding:.7rem .8rem;border-radius:var(--r2);font-size:.92rem;font-weight:600}
.alerta{background:rgba(229,72,77,.14);box-shadow:inset 3px 0 0 var(--erro)}
.aviso{background:rgba(242,178,92,.1);box-shadow:inset 3px 0 0 var(--ambar);font-weight:400}
.aviso a{color:var(--ambar);font-weight:700;text-underline-offset:.2em}
#suporte:not(:target){display:none}
.links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.2rem 1rem;margin-top:1rem;font-size:.92rem}
.links a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--texto-2);text-underline-offset:.25em}
.rodape{margin-top:1.2rem;font-size:.84rem;color:var(--texto-3);text-align:center}
.casas{display:grid;gap:.5rem;margin-top:.7rem}
.casas button{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;min-height:3.4rem;padding:.6rem .9rem;border:0;border-radius:var(--r2);background:rgba(38,54,79,.5);box-shadow:inset 0 0 0 1px var(--linha);font-weight:700;text-align:left;cursor:pointer}
.casas button>span:first-child{display:grid;gap:.1rem;min-width:0}
.casas small{font-weight:400;font-size:.8rem;color:var(--texto-3);overflow-wrap:anywhere}
.casas .label{color:var(--ambar)}
.pe{padding:1.4rem 1rem calc(1.6rem + env(safe-area-inset-bottom));background:var(--couro);font-size:.84rem;color:var(--texto-3);text-align:center}
.pe a{display:inline-block;padding:.5rem .3rem;color:var(--texto-2);text-underline-offset:.25em}

/* a cadeira (SVG injetado por conta.js) e o "feito" */
.chair{display:block;width:100%;height:auto;overflow:visible}
.c-up,.c-pump{transform-box:fill-box}
.c-pump{transform-origin:0 0}
.feito{position:fixed;inset:0;z-index:80;display:grid;place-content:center;justify-items:center;gap:.9rem;padding:2rem;text-align:center;background:radial-gradient(60% 50% at 50% 40%,rgba(242,178,92,.18),transparent 70%),rgba(10,13,22,.97)}
.feito__art{width:min(52vw,12rem)}
.feito .neon{font-size:clamp(2.4rem,11vw,3.4rem)}
.feito__t{font-weight:600;color:var(--texto-2)}

@media (min-width:60rem){
  .conta{grid-template-columns:minmax(0,1fr) minmax(0,29rem);gap:4rem;padding:2.5rem 0 3.5rem}
  .ficha{margin:0;padding:1.7rem 1.6rem 1.6rem}
  .cena{position:relative;display:block;align-self:stretch;min-height:35rem;overflow:hidden;overflow:clip}
  .cena__luz{position:absolute;left:58%;top:0;width:2px;height:5rem;background:linear-gradient(rgba(236,231,221,0),rgba(236,231,221,.55))}
  .cena__luz::before{content:"";position:absolute;left:50%;top:100%;width:4.6rem;height:2.4rem;margin-left:-2.3rem;border-radius:2.3rem 2.3rem 0 0;background:linear-gradient(#EDB57E,#C27A3E 40%,#7c411d);box-shadow:0 2px 0 #3b1e0c}
  .cena__luz::after{content:"";position:absolute;left:50%;top:calc(100% + 2.4rem);width:30rem;height:32rem;margin-left:-15rem;background:radial-gradient(60% 8% at 50% 0,rgba(255,227,176,.75),transparent 70%),linear-gradient(rgba(242,178,92,.3),rgba(242,178,92,0) 88%);clip-path:polygon(43% 0,57% 0,100% 100%,0 100%);pointer-events:none}
  .cena__frase{position:relative;z-index:2;padding-top:2.2rem;font:400 clamp(3.4rem,6.2vw,5.2rem)/.9 var(--disp);text-shadow:0 2px 0 rgba(0,0,0,.35)}
  .cena__frase .ln{display:block}
  .cena__frase .neon{font-size:.8em}
  .cena__cadeira{position:absolute;z-index:1;left:58%;bottom:2.6rem;width:15.5rem;translate:-50% 0}
  .cena__piso{position:absolute;inset:auto 0 0 0;height:7.5rem;overflow:hidden;perspective:420px;-webkit-mask-image:linear-gradient(transparent,#000 60%);mask-image:linear-gradient(transparent,#000 60%)}
  .cena__piso::before{content:"";position:absolute;left:-50%;right:-50%;top:0;height:320%;transform-origin:50% 0;transform:rotateX(68deg);background:conic-gradient(#0b0d13 25%,#d6d0c4 0 50%,#0b0d13 0 75%,#d6d0c4 0) 50% 0/64px 64px;opacity:.5}
}
@media (hover:hover){
  .btn:hover:not(:disabled){background:var(--ambar)}
  .btn--ghost:hover:not(:disabled){background:var(--porcelana);color:var(--tinta)}
  .links a:hover,.pe a:hover{color:var(--porcelana)}
  .casas button:hover{box-shadow:inset 0 0 0 1px var(--ambar)}
}

@media (prefers-reduced-motion:no-preference){
  @keyframes pole-s{to{background-position:0 0,0 20px}}
  @keyframes strop{to{background-position:28.28px 0}}
  @keyframes swing{0%{transform:rotate(-6deg)}30%{transform:rotate(3.5deg)}55%{transform:rotate(-2.4deg)}78%{transform:rotate(.6deg)}100%{transform:rotate(-1.2deg)}}
  @keyframes rise{from{opacity:0;transform:translateY(16px)}}
  @keyframes step-in{from{opacity:0;transform:translateX(18px)}}
  @keyframes fade{from{opacity:0}}
  @keyframes neon{0%,14%{opacity:.16}16%{opacity:1}21%{opacity:.3}25%{opacity:1}33%{opacity:.62}37%,100%{opacity:1}}
  @keyframes neon-idle{0%,52%,53.4%,54.8%,100%{opacity:1}52.6%{opacity:.76}54%{opacity:.88}}
  @keyframes lamp-on{0%{opacity:0}10%{opacity:.85}14%{opacity:.15}24%{opacity:1}30%{opacity:.55}40%,100%{opacity:1}}
  @keyframes filament{0%,4%,41%,43.5%,78%,100%{opacity:1}3%{opacity:.86}42%{opacity:.9}77%{opacity:.94}}
  @keyframes c-settle{0%{transform:translateY(-18px)}62%{transform:translateY(1.5px)}100%{transform:none}}
  @keyframes c-pump{0%{transform:rotate(-9deg)}36%{transform:rotate(5deg)}100%{transform:none}}
  @keyframes c-rise{0%{transform:translateY(12px)}28%{transform:translateY(3px)}42%{transform:translateY(5px)}72%{transform:translateY(-5px)}100%{transform:none}}
  @keyframes c-bomba{0%,100%{transform:none}30%{transform:rotate(-10deg)}62%{transform:rotate(5deg)}}

  .pole--mini i{animation:pole-s 2.8s linear infinite}
  .ficha{animation:rise .8s var(--ease) .1s backwards}
  .plaque{animation:swing 2.4s var(--ease) .15s both}
  .titulo .neon{animation:neon 1.4s linear .7s backwards,neon-idle 9s linear 4s infinite}
  .strop i{transition:width .7s var(--ease);animation:strop 1.4s linear infinite}
  .forca i{transition:width .4s var(--ease),background .4s}
  .js .step.is-on{animation:step-in .45s var(--ease-out)}
  .btn{transition:background .3s,color .3s,transform .25s var(--ease),box-shadow .3s}
  .field input,.slugline{transition:border-color .2s}
  .cena__frase .ln{animation:rise .9s var(--ease) .3s backwards}
  .cena__frase .neon{animation:neon 1.4s linear 1.1s backwards,neon-idle 9s linear 5s infinite}
  .cena__luz::after{animation:lamp-on 1s linear .8s backwards,filament 9s linear 3s infinite}
  .cena .c-up{animation:c-settle 1.5s cubic-bezier(.3,.9,.3,1) .5s backwards;transition:translate .7s cubic-bezier(.3,.8,.3,1)}
  .cena .c-pump{animation:c-pump 1.5s cubic-bezier(.3,.9,.3,1) .5s backwards;transition:rotate .7s cubic-bezier(.3,.8,.3,1)}
  .feito{animation:fade .35s}
  .feito .c-up{animation:c-rise 1.5s var(--ease) .15s both}
  .feito .c-pump{animation:c-bomba .75s var(--ease) .15s 2}
  .feito .neon{animation:neon 1.2s linear .5s backwards}
  .feito__t{animation:rise .7s var(--ease) .9s backwards}
  @media (hover:hover){
    .btn:hover:not(:disabled)::before{translate:110% 0;transition:translate .8s var(--ease)}
    .conta:has(.btn:not(.btn--ghost):hover) .cena .c-up{translate:0 -7px}
    .conta:has(.btn:not(.btn--ghost):hover) .cena .c-pump{rotate:4deg}
  }
}