/* BOSS Hub · tela de login no padrão da página de vendas (17/10/2026). Só aparência; o login e a verificação seguem iguais. */
@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@300;400;500;600;700&family=Instrument+Serif:ital@1&family=JetBrains+Mono:wght@500;700&display=swap');
:root{--lg-neon:#00ff41;--lg-neon2:#5cff8a;--lg-ink:#eef2ee;--lg-mute:rgba(238,242,238,.6);--lg-line:rgba(238,242,238,.1)}
html,body{background:#070907!important}
body{font-family:"Inter Tight",Inter,system-ui,sans-serif!important;-webkit-font-smoothing:antialiased}
body::after{background:radial-gradient(50% 60% at 100% 0%,rgba(0,255,65,.10),transparent 60%),radial-gradient(40% 50% at 70% 100%,rgba(0,255,65,.07),transparent 60%)!important}
.bear{display:none!important}
/* lado do urso */
.lg-hero{position:fixed;left:0;top:0;bottom:0;width:56vw;overflow:hidden;z-index:1;background:#0a0c0a}
.lg-hero video,.lg-hero .lg-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.lg-shade{position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,#070907 99%),linear-gradient(180deg,rgba(7,9,7,.15) 0%,transparent 30%,rgba(7,9,7,.72) 55%,#070907 100%),radial-gradient(70% 50% at 20% 80%,rgba(7,9,7,.6),transparent 70%)}
.lg-copy{position:absolute;left:clamp(28px,5vw,72px);right:clamp(28px,6vw,96px);bottom:clamp(28px,6vh,64px)}
.lg-kick{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(238,242,238,.45);display:flex;gap:12px;align-items:center}
.lg-kick b{color:var(--lg-neon2);font-weight:500}.lg-kick i{width:7px;height:7px;border-radius:50%;background:var(--lg-neon);box-shadow:0 0 10px var(--lg-neon);animation:lgp 1.6s ease-in-out infinite}
@keyframes lgp{50%{opacity:.35}}
.lg-copy h1{margin:16px 0 0;font-weight:300;font-size:clamp(44px,5.2vw,86px);line-height:.96;letter-spacing:-.05em;color:#fff;text-shadow:0 10px 60px rgba(0,0,0,.7)}
.lg-copy h1 em{font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;font-size:1.06em;letter-spacing:-.02em;color:var(--lg-neon2);text-shadow:0 0 40px rgba(0,255,65,.5)}
.lg-copy p{margin:18px 0 0;max-width:460px;font-size:16px;line-height:1.55;color:rgba(238,242,238,.75)}
.lg-marq{margin-top:26px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.lg-row{display:flex;gap:10px;width:max-content;animation:lgmq 40s linear infinite}
@keyframes lgmq{to{transform:translateX(-50%)}}
.lg-row span{flex:none;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:rgba(20,24,20,.75);box-shadow:inset 0 0 0 1px var(--lg-line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.lg-row img{width:24px;height:24px;object-fit:contain;border-radius:6px}
.lg-trust{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:20px;font-size:13px;color:rgba(238,242,238,.6)}
.lg-trust span{display:inline-flex;align-items:center;gap:7px}.lg-trust span::before{content:"✓";color:var(--lg-neon2);font-weight:700}
/* lado do login */
.wrap{position:relative;z-index:2;margin-left:56vw!important;width:44vw!important;max-width:none!important;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:40px clamp(24px,4vw,64px)!important;box-sizing:border-box}
.wrap>*{width:100%;max-width:420px}
.brand{text-align:left!important;margin-bottom:22px!important;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.brand-logo{width:48px!important;height:48px!important;margin:0!important;filter:drop-shadow(0 0 18px rgba(0,255,65,.35))!important}
.brand-name{font-family:"Inter Tight",sans-serif!important;font-size:20px!important;letter-spacing:-.02em!important;text-transform:none!important;color:#fff!important;font-weight:600}
.brand-name b{color:#fff!important;font-weight:600!important}
.status{margin:0 0 0 auto!important;font-family:"JetBrains Mono",monospace!important;font-size:10px!important;letter-spacing:.14em!important;color:var(--lg-neon2)!important;padding:5px 10px;border-radius:999px;background:rgba(0,255,65,.08);box-shadow:inset 0 0 0 1px rgba(0,255,65,.3)}
.card{transform:none!important;border:0!important;border-radius:26px!important;padding:30px 28px 26px!important;background:radial-gradient(120% 60% at 50% 0%,rgba(0,255,65,.09),transparent 60%),rgba(13,17,13,.86)!important;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  box-shadow:inset 0 0 0 1px rgba(238,242,238,.12),0 40px 120px rgba(0,0,0,.85),0 0 80px -30px rgba(0,255,65,.45)!important}
.card::after{display:none!important}
.card::before{width:140px!important;background:linear-gradient(90deg,transparent,var(--lg-neon),transparent)!important}
.card-title{font-family:"Inter Tight",sans-serif!important;font-weight:300!important;font-size:34px!important;letter-spacing:-.045em!important;color:#fff!important}
.card-sub{font-size:14px!important;color:var(--lg-mute)!important;margin-bottom:22px!important}
.field label{font-family:"JetBrains Mono",monospace!important;font-weight:500!important;letter-spacing:.14em!important;color:rgba(238,242,238,.45)!important}
.field input{font-family:"Inter Tight",sans-serif!important;font-size:15px!important;border-radius:14px!important;border:0!important;background:rgba(255,255,255,.04)!important;box-shadow:inset 0 0 0 1px var(--lg-line)!important;height:50px;transition:box-shadow .2s,background .2s}
.field input:focus{background:rgba(0,255,65,.04)!important;box-shadow:inset 0 0 0 1px rgba(0,255,65,.6),0 0 30px -12px rgba(0,255,65,.7)!important}
.btn{font-family:"Inter Tight",sans-serif!important;border-radius:999px!important;height:54px;font-size:16px!important;font-weight:600!important;letter-spacing:0!important;background:var(--lg-neon)!important;color:#031a08!important;border:0!important;box-shadow:0 0 0 1px rgba(0,255,65,.6),0 10px 40px rgba(0,255,65,.3)!important;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s!important}
.btn:hover:not(:disabled){transform:translateY(-2px)!important;box-shadow:0 0 0 1px rgba(0,255,65,.8),0 14px 50px rgba(0,255,65,.45)!important}
.btn-ghost{border-radius:999px!important}
.forgot a{color:var(--lg-mute)!important}.forgot a:hover{color:var(--lg-neon2)!important}
.hbl-venda{font-family:"Inter Tight",sans-serif!important;margin-top:16px!important;width:100%!important;max-width:420px!important;box-sizing:border-box;border:0!important;box-shadow:inset 0 0 0 1px rgba(0,255,65,.3);background:rgba(0,255,65,.05)!important}
.footer{font-family:"JetBrains Mono",monospace!important;letter-spacing:.14em!important;text-align:center}
.modal{border-radius:24px!important;background:#0d110d!important;border:0!important;box-shadow:inset 0 0 0 1px rgba(238,242,238,.12),0 40px 120px rgba(0,0,0,.9)!important}
/* celular e tela estreita: urso vira fundo, login centralizado por cima */
@media (max-width:1000px){
  .lg-hero{width:100vw}
  .lg-shade{background:linear-gradient(180deg,rgba(7,9,7,.35),rgba(7,9,7,.82) 45%,#070907 100%)}
  .lg-copy{display:none}
  .wrap{margin-left:0!important;width:100%!important;padding:28px 16px!important}
}
@media (prefers-reduced-motion:reduce){.lg-row{animation:none}}
/* 17/10: logo = urso redondo com anel verde */
.brand-logo{border-radius:50%!important;object-fit:cover!important;box-shadow:0 0 0 3px #00ff41,0 0 0 6px #04170a,0 0 28px rgba(0,255,65,.65)!important;filter:none!important;width:52px!important;height:52px!important}
/* 17/10: celular — urso numa faixa no topo, login embaixo (antes ficava escondido atrás do cartão) */
@media (max-width:1000px){
  body{display:block!important;overflow-x:hidden}
  .lg-hero{position:relative!important;width:100%!important;height:46vh!important;min-height:300px;bottom:auto!important}
  .lg-hero video,.lg-hero .lg-poster{object-position:50% 45%!important}
  .lg-shade{background:linear-gradient(180deg,rgba(7,9,7,.1) 0%,transparent 40%,rgba(7,9,7,.7) 80%,#070907 100%)!important}
  .wrap{margin:-70px 0 0!important;width:100%!important;min-height:0!important;padding:0 16px 28px!important;position:relative;z-index:3}
  .brand{justify-content:space-between}
}

@media (max-width:1000px){.status{display:none!important}}
/* 17/10: celular sem faixa preta no topo; urso mais alto e login subindo */
@media (max-width:1000px){
  html,body{padding:0!important;margin:0!important}
  .lg-hero{height:36vh!important;min-height:240px!important}
  .lg-hero video,.lg-hero .lg-poster{object-position:50% 30%!important}
  .wrap{margin-top:-64px!important;padding-bottom:20px!important}
  .brand{margin-bottom:14px!important}
  .card{padding:22px 20px 18px!important}
  .card-sub{margin-bottom:16px!important}
}
/* 17/10: celular — tudo cabe na tela visível (acima da barra do Safari) */
@media (max-width:1000px){
  .lg-hero{height:30vh!important;height:30svh!important;min-height:190px!important}
  .lg-hero video,.lg-hero .lg-poster{object-position:50% 22%!important}
  .wrap{margin-top:-56px!important}
  .brand{margin-bottom:10px!important}.brand-logo{width:44px!important;height:44px!important}
  .card{padding:18px 18px 14px!important}
  .card-title{font-size:28px!important}.card-sub{margin-bottom:12px!important;font-size:13px!important}
  .field{margin-bottom:10px!important}.field input{height:44px!important}
  .btn{height:48px!important}
  .forgot{margin-top:10px!important}
  .hbl-venda{margin-top:10px!important}
  .footer{display:none!important}
}
