/* CANTAIMY v7.5.5.1 — login viewport-fit */
.login-gate{
  min-height:100dvh;
  height:100dvh;
  display:grid;
  place-items:center;
  padding:
    max(10px,env(safe-area-inset-top))
    16px
    max(10px,env(safe-area-inset-bottom));
  box-sizing:border-box;
  background:
    radial-gradient(circle at 20% 50%,rgba(255,0,153,.18),transparent 32%),
    radial-gradient(circle at 80% 50%,rgba(0,153,255,.17),transparent 32%),
    linear-gradient(135deg,#05040f 0%,#071426 55%,#040611 100%);
  overflow:hidden;
}

.login-hero-shell{
  position:relative;
  width:min(100%,980px);
  height:100%;
  max-height:100%;
  display:grid;
  place-items:center;
  min-height:0;
}

.login-hero-shell::before{
  content:"";
  position:absolute;
  inset:-6% -18%;
  pointer-events:none;
  opacity:1;
  background:
    radial-gradient(circle at 17% 52%,rgba(255,0,159,.24),transparent 24%),
    radial-gradient(circle at 83% 52%,rgba(0,174,255,.22),transparent 24%);
  filter:blur(.2px);
}

.login-hero-card{
  position:relative;
  z-index:1;
  width:min(100%,660px);
  max-height:calc(100dvh - 24px);
  padding:
    clamp(18px,3.4vh,38px)
    clamp(22px,4vw,54px)
    clamp(16px,2.8vh,30px);
  box-sizing:border-box;
  text-align:center;
  border:1px solid rgba(143,93,255,.34);
  border-radius:clamp(22px,3vh,34px);
  background:linear-gradient(180deg,rgba(13,15,48,.94),rgba(5,10,32,.96));
  box-shadow:0 28px 80px rgba(0,0,0,.42),0 0 70px rgba(72,52,255,.08) inset;
  backdrop-filter:blur(18px);
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(135,92,255,.35) transparent;
}

.login-brand-logo{
  display:block;
  width:min(100%,clamp(280px,42vw,450px));
  max-height:clamp(92px,20vh,158px);
  object-fit:contain;
  margin:0 auto clamp(10px,2vh,18px);
}

.login-slogan{
  margin:0 0 clamp(10px,2vh,18px);
  font-size:clamp(24px,min(3vw,4.2vh),46px);
  line-height:1.05;
  font-weight:800;
  letter-spacing:-.03em;
  color:#f5f6fb;
}

.login-hit{color:#ff38c6}
.login-audience{color:#20bfff}

.login-intro{
  margin:0 auto clamp(12px,2.2vh,22px);
  max-width:560px;
  color:#c7cce0;
  font-size:clamp(13px,min(1.3vw,2vh),17px);
  line-height:1.42;
}

.login-actions{
  display:grid;
  gap:clamp(8px,1.5vh,12px);
  width:min(100%,560px);
  margin:0 auto;
}

.login-email-btn,
.login-google-btn,
.login-create-btn{
  min-height:clamp(44px,6.4vh,56px);
  border-radius:16px;
  font-size:clamp(15px,min(1.35vw,2.1vh),18px);
  font-weight:700;
  cursor:pointer;
}

.login-email-btn{
  border:0;
  color:#fff;
  background:linear-gradient(90deg,#712bff 0%,#ef2dc6 46%,#ff8b16 100%);
  box-shadow:0 10px 30px rgba(236,54,181,.22);
}

.login-google-btn{
  border:1px solid rgba(255,255,255,.18);
  color:#f5f6fb;
  background:rgba(4,6,20,.75);
}

.login-btn-icon{margin-right:10px}

.google-g{
  display:inline-grid;
  place-items:center;
  margin-right:10px;
  width:22px;
  height:22px;
  border-radius:50%;
  font-weight:900;
  background:conic-gradient(#4285F4 0 25%,#34A853 25% 50%,#FBBC05 50% 75%,#EA4335 75% 100%);
  color:#fff;
}

.login-divider{
  width:min(100%,560px);
  margin:clamp(10px,1.7vh,16px) auto;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:14px;
  color:#aeb4c8;
  font-size:clamp(12px,1.7vh,15px);
}

.login-divider span{
  height:1px;
  background:rgba(255,255,255,.18);
}

.login-divider b{
  font-weight:500;
}

.login-create-btn{
  min-height:30px;
  border:0;
  background:transparent;
  color:#7c73ff;
  font-size:clamp(14px,1.9vh,17px);
}

.login-legal-note{
  margin:clamp(10px,1.8vh,17px) auto 0;
  color:#a8aec0;
  font-size:clamp(10px,1.45vh,12.5px);
  line-height:1.35;
}

.login-legal-link{
  padding:0;
  border:0;
  background:none;
  color:#a665ff;
  cursor:pointer;
}

/* Short desktop/laptop screens */
@media (max-height:820px) and (min-width:821px){
  .login-gate{
    padding-top:8px;
    padding-bottom:8px;
  }

  .login-hero-card{
    width:min(100%,640px);
    padding:18px 46px 16px;
    border-radius:24px;
  }

  .login-brand-logo{
    width:min(100%,430px);
    max-height:118px;
    margin-bottom:8px;
  }

  .login-slogan{
    font-size:30px;
    margin-bottom:8px;
  }

  .login-intro{
    font-size:14px;
    margin-bottom:12px;
    line-height:1.35;
  }

  .login-actions{
    gap:8px;
  }

  .login-email-btn,
  .login-google-btn{
    min-height:44px;
    font-size:15px;
  }

  .login-divider{
    margin:9px auto;
  }

  .login-create-btn{
    min-height:26px;
    font-size:14px;
  }

  .login-legal-note{
    margin-top:8px;
    font-size:10.5px;
  }
}

/* Very short desktop/laptop screens */
@media (max-height:700px) and (min-width:821px){
  .login-hero-card{
    width:min(100%,600px);
    padding:12px 38px 10px;
  }

  .login-brand-logo{
    width:min(100%,360px);
    max-height:92px;
    margin-bottom:5px;
  }

  .login-slogan{
    font-size:25px;
    margin-bottom:5px;
  }

  .login-intro{
    font-size:12.5px;
    margin-bottom:8px;
  }

  .login-email-btn,
  .login-google-btn{
    min-height:40px;
    font-size:14px;
  }

  .login-divider{
    margin:6px auto;
  }

  .login-create-btn{
    font-size:13px;
    min-height:22px;
  }

  .login-legal-note{
    margin-top:5px;
    font-size:9.5px;
  }
}

/* Phone / small tablet */
@media(max-width:820px){
  .login-gate{
    min-height:100dvh;
    height:100dvh;
    padding:
      max(8px,env(safe-area-inset-top))
      10px
      max(8px,env(safe-area-inset-bottom));
  }

  .login-hero-shell{
    min-height:0;
    height:100%;
  }

  .login-hero-card{
    width:min(100%,560px);
    max-height:100%;
    padding:
      clamp(14px,2.8vh,24px)
      16px
      clamp(12px,2.4vh,20px);
    border-radius:22px;
  }

  .login-brand-logo{
    width:min(100%,360px);
    max-height:clamp(82px,18vh,130px);
    margin-bottom:clamp(6px,1.5vh,12px);
  }

  .login-slogan{
    font-size:clamp(23px,7vw,34px);
    margin-bottom:clamp(7px,1.6vh,12px);
  }

  .login-intro{
    font-size:clamp(12px,3.4vw,14.5px);
    margin-bottom:clamp(9px,1.8vh,15px);
  }

  .login-email-btn,
  .login-google-btn{
    min-height:46px;
    font-size:15px;
  }

  .login-divider{
    margin:9px auto;
  }

  .login-create-btn{
    font-size:14px;
    min-height:28px;
  }

  .login-legal-note{
    margin-top:8px;
    font-size:10px;
  }
}

/* Landscape phones */
@media(max-width:820px) and (orientation:landscape){
  .login-hero-card{
    width:min(96vw,760px);
    max-height:calc(100dvh - 12px);
    padding:10px 24px;
  }

  .login-brand-logo{
    width:min(100%,300px);
    max-height:76px;
    margin-bottom:4px;
  }

  .login-slogan{
    font-size:22px;
    margin-bottom:4px;
  }

  .login-intro{
    font-size:11.5px;
    margin-bottom:6px;
  }

  .login-actions{
    width:min(100%,520px);
    gap:6px;
  }

  .login-email-btn,
  .login-google-btn{
    min-height:38px;
    font-size:13px;
  }

  .login-divider{
    margin:5px auto;
  }

  .login-create-btn{
    min-height:20px;
    font-size:12px;
  }

  .login-legal-note{
    margin-top:4px;
    font-size:9px;
  }
}


.login-hero-shell::after{
  content:"";
  position:absolute;
  left:-16vw;
  right:-16vw;
  top:50%;
  height:min(38vh,310px);
  transform:translateY(-50%);
  pointer-events:none;
  opacity:.9;
  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(255,0,145,.05) 4%,
      rgba(255,0,145,.12) 18%,
      transparent 38%,
      transparent 62%,
      rgba(0,179,255,.12) 82%,
      rgba(0,179,255,.05) 96%,
      transparent 100%
    );
}


.login-gate::before,
.login-gate::after{
  content:"";
  position:fixed;
  top:50%;
  width:34vw;
  height:min(42vh,330px);
  transform:translateY(-42%);
  pointer-events:none;
  z-index:0;
  opacity:.82;
  background-repeat:no-repeat;
  background-position:center;
  background-size:100% 100%;
  filter:drop-shadow(0 0 18px currentColor);
}

.login-gate::before{
  left:0;
  color:rgba(255,0,170,.85);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 700 260'%3E%3Cpath d='M0 170 C80 100 130 230 220 150 S360 70 430 145 S560 215 700 125' fill='none' stroke='%23ff149f' stroke-width='4' opacity='.9'/%3E%3Cpath d='M0 185 C90 115 145 220 230 165 S360 95 445 155 S570 205 700 140' fill='none' stroke='%23bf24ff' stroke-width='2.2' opacity='.7'/%3E%3Cpath d='M0 150 C70 85 145 210 235 135 S365 65 445 135 S575 205 700 105' fill='none' stroke='%23ff4bc4' stroke-width='1.6' opacity='.55'/%3E%3Cg stroke='%23ff3ab7' opacity='.45'%3E%3Cpath d='M70 80v100'/%3E%3Cpath d='M105 105v90'/%3E%3Cpath d='M145 55v150'/%3E%3Cpath d='M190 100v105'/%3E%3Cpath d='M245 70v150'/%3E%3Cpath d='M295 120v85'/%3E%3Cpath d='M345 60v150'/%3E%3Cpath d='M390 105v110'/%3E%3Cpath d='M450 80v130'/%3E%3Cpath d='M510 118v90'/%3E%3Cpath d='M565 70v145'/%3E%3Cpath d='M620 110v95'/%3E%3C/g%3E%3C/svg%3E");
}

.login-gate::after{
  right:0;
  color:rgba(0,185,255,.85);
  transform:translateY(-42%) scaleX(-1);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 700 260'%3E%3Cpath d='M0 170 C80 100 130 230 220 150 S360 70 430 145 S560 215 700 125' fill='none' stroke='%2300bfff' stroke-width='4' opacity='.9'/%3E%3Cpath d='M0 185 C90 115 145 220 230 165 S360 95 445 155 S570 205 700 140' fill='none' stroke='%232e7bff' stroke-width='2.2' opacity='.7'/%3E%3Cpath d='M0 150 C70 85 145 210 235 135 S365 65 445 135 S575 205 700 105' fill='none' stroke='%2300e0ff' stroke-width='1.6' opacity='.55'/%3E%3Cg stroke='%2300c8ff' opacity='.45'%3E%3Cpath d='M70 80v100'/%3E%3Cpath d='M105 105v90'/%3E%3Cpath d='M145 55v150'/%3E%3Cpath d='M190 100v105'/%3E%3Cpath d='M245 70v150'/%3E%3Cpath d='M295 120v85'/%3E%3Cpath d='M345 60v150'/%3E%3Cpath d='M390 105v110'/%3E%3Cpath d='M450 80v130'/%3E%3Cpath d='M510 118v90'/%3E%3Cpath d='M565 70v145'/%3E%3Cpath d='M620 110v95'/%3E%3C/g%3E%3C/svg%3E");
}

.login-hero-shell,
.login-hero-card{
  position:relative;
  z-index:1;
}

@media(max-width:820px){
  .login-gate::before,
  .login-gate::after{
    width:46vw;
    height:26vh;
    opacity:.42;
    top:54%;
  }
}


/* v7.5.5.4 — login language selector */
.login-language{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  margin:0 auto clamp(8px,1.5vh,14px);
  padding:4px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:rgba(255,255,255,.035);
}
.login-lang-btn{
  min-width:38px;
  height:32px;
  padding:0 10px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#aeb5c9;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.login-lang-btn.active{
  color:#fff;
  background:linear-gradient(90deg,#7433ff,#d93ed8);
  box-shadow:0 4px 14px rgba(129,77,255,.24);
}
@media(max-height:700px) and (min-width:821px){
  .login-language{
    margin-bottom:5px;
    padding:3px;
  }
  .login-lang-btn{
    min-width:34px;
    height:28px;
    font-size:11px;
  }
}
@media(max-width:820px){
  .login-language{
    margin-bottom:8px;
  }
  .login-lang-btn{
    min-width:36px;
    height:30px;
    font-size:11px;
  }
}


/* v7.5.5.5 — Privacy Policy page */
.privacy-page-shell{
  width:100%;
  padding:28px 18px 110px;
  box-sizing:border-box;
}
.privacy-page-card{
  width:min(100%,920px);
  margin:0 auto;
  padding:28px 34px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(8,7,30,.86);
  box-shadow:0 20px 50px rgba(0,0,0,.28);
}
.privacy-lang-row{
  display:flex;
  gap:6px;
  justify-content:flex-end;
  margin-bottom:18px;
}
.privacy-lang-btn{
  min-width:38px;
  height:32px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:rgba(255,255,255,.03);
  color:#aeb5c9;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.privacy-lang-btn.active{
  color:#fff;
  background:linear-gradient(90deg,#7138ff,#d93ed8);
}
.privacy-copy{
  color:#cbd1e1;
  font-size:14px;
  line-height:1.65;
}
.privacy-copy h2{
  margin:0 0 8px;
  color:#fff;
  font-size:30px;
}
.privacy-copy h3{
  margin:24px 0 8px;
  color:#fff;
  font-size:17px;
}
.privacy-copy p{
  margin:0 0 12px;
}
.privacy-copy ul{
  margin:8px 0 14px 20px;
  padding:0;
}
.privacy-copy li{
  margin-bottom:5px;
}
@media(max-width:820px){
  .privacy-page-shell{
    padding:18px 12px 96px;
  }
  .privacy-page-card{
    padding:20px 16px;
    border-radius:14px;
  }
  .privacy-copy{
    font-size:13px;
  }
  .privacy-copy h2{
    font-size:24px;
  }
  .privacy-copy h3{
    font-size:16px;
  }
}