/* =========================================================
   🔧 RESET
========================================================= */

*{ box-sizing:border-box }

body{
  margin:0;
  font-family:'Inter',system-ui,sans-serif;
  background:#0f172a;
  color:#0f172a;
}

.beta-top-strip{
  position:sticky;
  top:0;
  z-index:1200;
  background:linear-gradient(90deg,#4338ca,#6366f1,#7c3aed);
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,.2);
  box-shadow:0 6px 18px rgba(67,56,202,.35);
}
.beta-top-strip__inner{
  max-width:1200px;
  margin:0 auto;
  padding:9px 16px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:10px 14px;
  font-size:13px;
}
.beta-top-strip__tag{
  padding:2px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.42);
  background:rgba(255,255,255,.14);
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
}
.beta-top-strip__inner strong{
  font-size:13px;
  font-weight:800;
}
.beta-top-strip__timer{
  font-weight:600;
  opacity:.95;
}

/* =========================================================
   🚀 HERO
========================================================= */

.hero{
  position:relative;
  padding:48px 24px 64px;
  overflow:hidden;

  background:
    radial-gradient(ellipse 120% 80% at 50% -20%, rgba(99,102,241,.16), transparent 55%),
    radial-gradient(900px 500px at -10% 30%, rgba(139,92,246,.12), transparent),
    radial-gradient(700px 400px at 90% 70%, rgba(59,130,246,.10), transparent),
    linear-gradient(180deg, #f8fafc 0%, #eef2ff 45%, #f8fafc 100%);
  background-attachment: scroll;
}

.hero-bg-orb{
  position:absolute;
  width:min(520px, 90vw);
  height:min(520px, 90vw);
  right:-8%;
  top:10%;
  border-radius:50%;
  background:radial-gradient(circle at 40% 40%, rgba(99,102,241,.2), rgba(139,92,246,.06) 45%, transparent 70%);
  pointer-events:none;
  filter:blur(1px);
}

.hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(600px 300px at 15% 20%, rgba(99,102,241,.10), transparent 60%),
    radial-gradient(500px 260px at 85% 85%, rgba(168,85,247,.10), transparent 60%);
}

.hero-inner{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:48px;
  align-items:start;
  position:relative;
  z-index:1;
}


.hero .badge{
  position:relative !important;
  inset:auto !important;

  display:inline-block;
  margin-bottom:18px;

  z-index:1;
}

.hero-meta{
  margin-top:14px;
  font-size:13px;
  color:#64748b;
  font-weight:600;
}

/* =========================================================
   🏷️ BRAND
========================================================= */

/* =========================================
   🏷️ LOGO LOCKUP (PRO)
========================================= */

.brand{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  overflow:visible;
  width:100%;
  margin-bottom:4px;
}

.brand img{
  width:min(300px, 88vw);
  height:auto;
  margin:0;
  transform:none;
  display:block;
}


@media (max-width:768px){

.brand{
align-items:center;
}

.brand img{
  width:min(280px, 85vw);
}
}

.hero-kicker{
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#6366f1;
  margin:0 0 14px;
}

.hero-title-accent{
  color:#0f172a;
  font-weight:900;
}

.hero-pills{
  list-style:none;
  margin:20px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.hero-pills li{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:700;
  color:#334155;
  background:rgba(255,255,255,.75);
  border:1px solid rgba(99,102,241,.2);
  padding:8px 12px;
  border-radius:999px;
  box-shadow:0 4px 14px rgba(15,23,42,.06);
}

.hero-pill-ico{
  font-size:15px;
  line-height:1;
}

.hero-onboard{
  margin:22px 0 0;
  font-size:14px;
  font-weight:600;
}

.hero-onboard a{
  color:#4f46e5;
  text-decoration:none;
  border-bottom:1px solid rgba(79,70,229,.35);
  transition:color .15s ease, border-color .15s ease;
}

.hero-onboard a:hover{
  color:#6366f1;
  border-bottom-color:#6366f1;
}

.login-beta-note{
  margin:14px 0 0;
  max-width:36em;
  font-size:13px;
  line-height:1.5;
  color:#64748b;
  font-weight:500;
}
.login-beta-note strong{
  color:#475569;
  font-weight:700;
}

.login-card-wrap{
  position:relative;
  width:100%;
  max-width:400px;
  margin-left:auto;
}

.login-card-wrap::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(99,102,241,.45), rgba(139,92,246,.25), rgba(99,102,241,.15));
  z-index:0;
  opacity:.85;
}

.login-card-wrap .login-card{
  position:relative;
  z-index:1;
  margin-left:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98) 0%, #f8fafc 100%);
  border:1px solid rgba(226,232,240,.95);
  box-shadow:
    0 24px 60px rgba(15,23,42,.12),
    0 0 0 1px rgba(255,255,255,.6) inset;
}

.login-kicker{
  margin:0 0 4px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#6366f1;
}

.login-lead{
  margin:0 0 18px;
  font-size:14px;
  color:#64748b;
  line-height:1.45;
  font-weight:500;
}

.input-label{
  display:block;
  font-size:12px;
  font-weight:700;
  color:#475569;
  margin:12px 0 6px;
}

.input-group:first-of-type .input-label{
  margin-top:0;
}

.password-row{
  position:relative;
}

.password-row input{
  padding-right:48px;
}

.login-submit{
  width:100%;
  margin-top:6px;
  min-height:48px;
  font-size:15px;
}

.login-trust{
  font-size:11px !important;
  opacity:.75;
  margin-top:14px !important;
}

.section-eyebrow{
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#6366f1;
  margin:0 0 14px;
}

.progress-inner h3{
  font-size:clamp(1.35rem, 3vw, 1.75rem);
  font-weight:900;
  letter-spacing:-.03em;
  margin:0 0 10px;
  color:#0f172a;
}

.progress-blurb{
  margin:0 auto 22px;
  max-width:520px;
  font-size:14px;
  color:#64748b;
  font-weight:500;
  line-height:1.5;
}

/* =========================================================
   ✨ TEXTOS
========================================================= */

.badge{
  display:inline-block;
  background:#eef2ff;
  color:#4338ca;
  font-weight:700;
  font-size:13px;
  padding:6px 12px;
  border-radius:999px;
  margin-bottom:18px;
}

.hero h1{
  font-size:48px;
  line-height:1.05;
  margin:0 0 16px;
  font-weight:900;
  letter-spacing:-.8px;
}

.highlight{
  background:linear-gradient(90deg,#4f46e5,#7c3aed);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

.hero-sub{
  color:#475569;
  font-size:clamp(15px, 1.9vw, 18px);
  line-height:1.6;
  margin:0 0 8px;
  max-width:36em;
  font-weight:500;
}

/* =========================================================
   🔐 LOGIN CARD (USA O .card DO COMPONENTS)
========================================================= */

.login-card{
  padding:32px 28px 28px;
  max-width:420px;
  margin-left:auto;
  border-radius:20px;
  min-width:0;
  overflow:hidden;
}

.login-card h2{
  margin-top:0;
  font-size:22px;
  font-weight:900;
}

/* =========================================================
   🧾 INPUT PREMIUM
========================================================= */

.input-group{
  position:relative;
}

.input-group input{
  width:100%;
  padding:14px 14px;
  margin:0 0 4px;

  border-radius:14px;
  border:1px solid #cbd5e1;
  background:#f8fafc;

  font-weight:600;
  transition:.18s;
}

.input-group input:focus{
  outline:none;
  border-color:#6366f1;
  background:#fff;
  box-shadow:0 0 0 3px rgba(99,102,241,.18);
}

/* senha */

.password-row input{
  padding-right:48px;
}

.toggle-pass{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  cursor:pointer;
  font-size:18px;
  opacity:.65;
  border:none;
  background:transparent;
  padding:8px;
  line-height:1;
}

.toggle-pass:hover{
  opacity:1;
}

/* =========================================================
   💬 MSG
========================================================= */

.msg{
    text-align:center;
    margin-top:12px;
    font-size:13px;
    min-height:18px;
}

/* sucesso / carregando */
.msg.success{
    color:#22c55e;
}

/* erro */
.msg.error{
    color:#ef4444;
}

/* neutro (opcional) */
.msg.info{
    color:#6366f1;
}

.loading{
  color:#22c55e;
}

/* =========================================================
   🔒 TRUST
========================================================= */

.trust{
  margin-top:16px;
  font-size:12px;
  color:#64748b;
  text-align:center;
  font-weight:600;
}

/* =========================================================
   📱 RESPONSIVO
========================================================= */

@media(max-width:980px){
  .hero-inner{
    grid-template-columns:1fr;
  }

  .hero h1{
    font-size:36px;
  }

  .login-card{
    max-width:100%;
  }

  .login-card-wrap{
    max-width:100%;
    margin-left:0;
  }
}

/* =========================================================
   📊 PROGRESS SECTION
========================================================= */

.progress-section{
  background:
    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  padding:64px 24px 56px;
  border-top:1px solid rgba(226,232,240,.9);
}

.progress-inner{
  max-width:900px;
  margin:0 auto;
  text-align:center;
}

.progress-card{
  margin-top:20px;
  text-align:left;
}

.progress-label{
  display:flex;
  justify-content:space-between;
  font-size:14px;
  margin-bottom:8px;
  font-weight:700;
}

.progress-bar{
  height:14px;
  background:#e2e8f0;
  border-radius:999px;
  overflow:hidden;
}

.progress-fill{
  height:100%;
  width:0%;
  background:linear-gradient(90deg,#6366f1,#8b5cf6);
  border-radius:999px;
  transition:width 1.2s ease;
}

/* =========================================================
   ✨ FEATURES
========================================================= */

.features{
  padding:72px 24px 88px;
  background:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(99,102,241,.06), transparent 50%),
    #ffffff;
}

.features-inner{
  max-width:1100px;
  margin:0 auto;
  text-align:center;
}

.features h2{
  font-size:clamp(1.5rem, 3.5vw, 2rem);
  margin-bottom:12px;
  font-weight:900;
  letter-spacing:-.03em;
  color:#0f172a;
}

.features-sub{
  color:#64748b;
  margin-bottom:48px;
  font-weight:600;
}

/* steps grid */

.steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  margin-bottom:50px;
}

.step{
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:22px;
  transition:.18s;
}

.step:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(99,102,241,.15);
}

.step-number{
  width:36px;
  height:36px;
  border-radius:50%;
  background:linear-gradient(90deg,#6366f1,#8b5cf6);
  color:white;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  margin:0 auto 10px;
}

/* modos */

.modes{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}

.mode-card{
  background:white;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:22px;
  text-align:left;
  box-shadow:0 10px 25px rgba(2,6,23,.06);
  transition:.18s;
}

.mode-card:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px rgba(99,102,241,.18);
}

/* responsivo */

@media(max-width:980px){
  .steps,
  .modes{
    grid-template-columns:1fr;
  }
}

.badge-competitive{
  display:inline-flex;
  align-items:center;
  gap:6px;

  background:linear-gradient(135deg,#eef2ff,#e0e7ff);
  color:#4338ca;

  font-weight:700;
  font-size:12px;
  padding:6px 12px;
  border-radius:999px;

  box-shadow:
    0 6px 18px rgba(99,102,241,.18),
    inset 0 1px 0 rgba(255,255,255,.7);

  animation:badgePulse 3s ease-in-out infinite;
}

@keyframes badgePulse{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-1px)}
}

.login-proof{
  margin-top:14px;
  font-size:13px;
  font-weight:600;
  color:#475569;
  text-align:center;
}

.login-urgency{
  margin-top:6px;
  font-size:13px;
  font-weight:800;
  color:#ef4444;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
  text-align:center;
  white-space:normal;      /* ⭐ permite quebra correta */
  word-break:keep-all;     /* ⭐ evita quebrar palavras feio */
}

@media (max-width:480px){

  .login-urgency{
    font-size:13px;
    line-height:1.25;
  }

}

/* 🔴 bolinha pulsante (EFEITO ARENA VIVA) */

.dot-live{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#ef4444;
  box-shadow:0 0 0 rgba(239,68,68,.6);
  animation:livePulse 1.8s infinite;
}


@keyframes livePulse{
  0%{ box-shadow:0 0 0 0 rgba(239,68,68,.6); }
  70%{ box-shadow:0 0 0 8px rgba(239,68,68,0); }
  100%{ box-shadow:0 0 0 0 rgba(239,68,68,0); }
}

.login-title{
  margin:0 0 8px;
  font-size:22px;
  font-weight:900;
  letter-spacing:-.3px;
  color:#0f172a;
}

/* =========================================
   HERO CLEAN MODE
========================================= */

.hero-clean{
  gap:28px;
}

.hero-copy{
  max-width:520px;
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.hero-title{
  font-size:clamp(28px,4vw,40px);
  line-height:1.15;
  margin:0 0 10px; 
  font-weight:800;
  letter-spacing:-.3px;
}

.login-focus{
  max-width:360px;
}

.login-proof.soft{
  margin-top:12px;
  font-size:12px;
  opacity:.7;
}

/* =========================================
   MOBILE — PRIORIDADE LOGIN
========================================= */

@media (max-width: 768px){

  .hero-inner{
    flex-direction:column;
    text-align:center;
  }

  .hero-copy{
    order:1;
    align-items:center;
    margin-left:auto;
    margin-right:auto;
  }

  .hero-pills{
    justify-content:center;
  }

  .login-focus{
    order:2;
    width:100%;
  }

  .hero-sub{
    font-size:14px;
    margin-left:auto;
    margin-right:auto;
  }
}

@media (max-width:768px){

  .hero-inner{
    justify-content:center;   /* 🔥 evita grudar */
    align-items:center;
    text-align:center;
  }

}

/* =========================================
   HERO INNER — CENTRALIZAÇÃO REAL
========================================= */

.hero-inner{
  width:100%;
  max-width:1100px;
  margin:0 auto;              /* 🔥 ISSO CENTRALIZA */
  padding:24px 18px;          /* respiro lateral mobile */
  box-sizing:border-box;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
}

/* =========================================
   BRAND TAGLINE — PREMIUM
========================================= */

.brand-tagline{
  margin-top:-6px;         /* 🔥 ajuste óptico REAL */
  font-size:13px;
  font-weight:600;
  color:#64748b;
  letter-spacing:.2px;
  opacity:.9;
  line-height:1.1;
}

/* mobile mais suave */

@media (max-width:768px){
  .brand-tagline{
    font-size:12.5px;
  }
}

/* ================================
FOOTER
================================ */

.site-footer{
margin-top:80px;
background:#0f172a;
color:#cbd5f1;
font-family:Inter, sans-serif;
}

.footer-inner{
max-width:1100px;
margin:auto;
padding:50px 20px;
display:flex;
justify-content:space-between;
gap:40px;
flex-wrap:wrap;
}

.footer-links{
display:flex;
gap:60px;
flex-wrap:wrap;
}

.footer-col{
display:flex;
flex-direction:column;
gap:10px;
}

.footer-col h4{
font-size:14px;
margin-bottom:6px;
color:white;
}

.footer-col a{
text-decoration:none;
color:#cbd5f1;
font-size:14px;
opacity:.85;
}

.footer-col a:hover{
opacity:1;
color:white;
}

.footer-bottom{
border-top:1px solid rgba(255,255,255,.08);
display:flex;
justify-content:space-between;
align-items:center;
padding:16px 20px;
max-width:1100px;
margin:auto;
font-size:13px;
opacity:.7;
}

.footer-bottom .footer-version{
  text-align:left;
  order:1;
}

.footer-bottom > div:first-child{
  order:2;
}

/* mobile */

@media(max-width:700px){

.footer-inner{
flex-direction:column;
gap:30px;
}

.footer-links{
gap:40px;
}

.footer-bottom{
flex-direction:column;
align-items:flex-start;
gap:10px;
text-align:left;
}

.footer-bottom .footer-version{
  order:-1;
}

.footer-bottom > div:first-child{
  order:0;
}

}

/* ===============================
LEGAL OVERLAY
=============================== */

.legal-overlay{
position:fixed;
inset:0;
background:#ffffff;
z-index:99999;

display:flex;
flex-direction:column;

transform:translateY(100%);
transition:transform .35s ease;
}

.legal-overlay.active{
transform:translateY(0);
}

.legal-header{
display:flex;
align-items:center;
justify-content:space-between;

padding:16px 20px;

border-bottom:1px solid #e5e7eb;
background:white;

font-weight:700;
}

.legal-close{
background:none;
border:none;
font-size:22px;
cursor:pointer;
}

.legal-content{
flex:1;
overflow:auto;

padding:30px 20px;

max-width:900px;
margin:auto;
width:100%;
line-height:1.7;
}

.footer-link{
cursor:pointer;
}

.footer-link:hover{
text-decoration:underline;
}

.site-footer a{
cursor:pointer;
transition:opacity .2s;
}

.site-footer a:hover{
opacity:.8;
}


/* ======
LOGIN GOOGLE SYSTEM
===*/

.divider{
  margin:16px 0;
  text-align:center;
  opacity:.6;
  font-size:12px;
}

.secondary-btn{
  margin-top:10px;
  width:100%;
  padding:12px;
  border-radius:12px;
  background:#0f172a;
  border:1px solid #334155;
  color:#cbd5f5;
  font-weight:600;
  cursor:pointer;
}

.secondary-btn:hover{
  background:#1e293b;
}

.google-btn{
  margin-top:10px;
  display:flex;
  justify-content:center;
}

.clickable{
  cursor: pointer;
}

/* ----- Alternar login / registro ----- */
.login-switch{
  margin:18px 0 0;
  padding:0;
  text-align:center;
  font-size:14px;
  font-weight:500;
  color:#64748b;
}
.login-switch a{
  color:#4f46e5;
  font-weight:600;
  text-decoration:none;
}
.login-switch a:hover{
  text-decoration:underline;
}
.login-switch button.login-inline-link{
  background:none;
  border:none;
  padding:0;
  margin:0;
  font:inherit;
  color:#4f46e5;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
}
.login-switch button.login-inline-link:hover{
  text-decoration:underline;
}
.register-back{
  margin-top:16px;
}
.login-form-actions{
  display:flex;
  justify-content:flex-end;
  margin:-4px 0 10px;
}
.login-forgot-link{
  font-size:13px;
  font-weight:600;
  color:#64748b;
  text-decoration:none;
}
.login-forgot-link:hover{
  color:#4f46e5;
  text-decoration:underline;
}
.login-hero-sub a.hero-sub-link{
  color:#4f46e5;
  font-weight:600;
  text-decoration:none;
  border-bottom:1px solid rgba(79,70,229,.35);
}
.login-hero-sub a.hero-sub-link:hover{
  color:#6366f1;
}
.login-page .hero-sub{
  margin-bottom:0;
}
.register-hero-sub{
  max-width:28em;
}
.register-beta-note{
  margin-top:12px;
}
.beta-countdown-card{
  margin-top:10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(99,102,241,.28);
  background:linear-gradient(135deg, rgba(99,102,241,.1), rgba(139,92,246,.07));
}
.beta-countdown-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:6px;
}
.beta-countdown-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:2px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  color:#4338ca;
  background:rgba(255,255,255,.8);
  border:1px solid rgba(99,102,241,.2);
}
.beta-countdown-head strong{
  font-size:13px;
  color:#312e81;
}
.beta-countdown-text{
  margin:0;
  font-size:12px;
  line-height:1.45;
  color:#475569;
}
.register-pending{
  margin-top:4px;
  text-align:left;
}
.register-pending .login-lead{
  margin-bottom:12px;
}
.register-legal-sep{
  opacity:.5;
  margin:0 4px;
}

/* ----- Google: um fluxo (GSI); 1º acesso = modal LGPD antes do iframe ----- */
.google-auth-stack{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:stretch;
}
.google-btn-login-wrap{
  min-height:48px;
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  max-width:100%;
  overflow:hidden;
  box-sizing:border-box;
  padding:0 4px;
}
.google-btn-login-wrap iframe{
  max-width:100% !important;
}
/* Botão nativo antes do modal (mesma linguagem visual do Google) */
.btn-google-unified{
  width:100%;
  max-width:320px;
  margin:0 auto;
  padding:11px 16px;
  border-radius:8px;
  border:1px solid #dadce0;
  background:#fff;
  color:#1f1f1f;
  font-weight:500;
  font-size:14px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  box-shadow:0 1px 2px rgba(60,64,67,.3), 0 1px 3px 1px rgba(60,64,67,.15);
  font-family:Roboto, system-ui, -apple-system, sans-serif;
  letter-spacing:.25px;
}
.btn-google-unified__logo{
  flex-shrink:0;
  display:block;
}
.btn-google-unified:hover{
  background:#f8f9fa;
  border-color:#dadce0;
}
.btn-google-unified:active{
  background:#f1f3f4;
}

/* ----- Termos em modal (iframe) ----- */
.modal-box[data-size="lg"]{
  max-width:min(760px, 96vw);
}
.modal-box[data-size="lg"] .modal-body{
  max-height:78vh;
}
.legal-modal-frame-wrap{
  width:100%;
  min-height:48vh;
}
.legal-modal-frame{
  width:100%;
  min-height:48vh;
  height:min(68vh, 620px);
  border:none;
  border-radius:10px;
  background:#f1f5f9;
}

/* ----- Cadastro: links legais tipo botão ----- */
.register-legal-row{
  text-align:left;
  font-size:13px;
  line-height:1.5;
  color:#475569;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  /* Empilha label + links; evita grid/flex herdado espremer o texto */
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:8px;
}
.register-legal-row .legal-links,
.register-legal-links{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px;
  margin:8px 0 0 0;
  padding:0;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
@media (min-width:400px){
  .register-legal-row .legal-links,
  .register-legal-links{
    padding-left:26px;
  }
}
.register-legal-row .legal-btn{
  background:transparent;
  border:none;
  padding:0;
  color:#6366f1;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  text-decoration:underline;
  font-family:inherit;
}
.register-legal-row .legal-btn:hover{
  color:#4f46e5;
}
.register-legal-row label,
.register-legal-check{
  /* Grid evita colapso de largura do texto (flex+min-width em mobile/WebView) */
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  column-gap:10px;
  row-gap:4px;
  align-items:start;
  cursor:pointer;
  font-size:13px;
  line-height:1.5;
  color:#475569;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
.register-legal-check input[type="checkbox"]{
  margin-top:3px;
  justify-self:start;
  width:18px;
  height:18px;
  flex-shrink:0;
}
.register-legal-check > span{
  min-width:0;
  max-width:100%;
  line-height:1.5;
}
/* PlayModal no login/cadastro — evita texto “escapando” pra direita no mobile */
#playModalRoot .modal-body{
  overflow-x:hidden;
  max-width:100%;
  box-sizing:border-box;
}
#playModalRoot #playModalContent{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}

/* Aceite Google (modal) */
.login-google-terms-modal{
  min-width:0;
  max-width:100%;
}
.login-google-terms-lead{
  margin:0 0 14px;
  font-size:14px;
  line-height:1.55;
  color:#334155;
}
.login-google-terms-btns{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:14px;
}
.login-google-terms-btns .btn-secondary{
  flex:1;
  min-width:min(140px, 100%);
}
.login-google-terms-check{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  column-gap:10px;
  align-items:start;
  font-size:14px;
  cursor:pointer;
  color:#334155;
  margin:0;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
.login-google-terms-check input{
  margin-top:3px;
  width:18px;
  height:18px;
}
.login-google-terms-check span{
  min-width:0;
  max-width:100%;
  line-height:1.5;
}