/* KOVRA — portal premium de acceso. Solo presentación; no altera lógica ni el logo. */
:root{
  --auth-bg:#030705;
  --auth-panel:#0a100d;
  --auth-panel-2:#101914;
  --auth-line:rgba(99,255,151,.22);
  --auth-line-soft:rgba(255,255,255,.075);
  --auth-green:#55ef7d;
  --auth-green-2:#27c95b;
  --auth-text:#f7fbf8;
  --auth-soft:#9ca9a1;
}

html,body{
  background:
    radial-gradient(circle at 50% -8%,rgba(70,238,118,.13),transparent 29%),
    linear-gradient(180deg,#030705 0%,#040906 45%,#020503 100%) !important;
}

body.auth-premium-page{
  position:relative;
  min-height:100svh;
  overflow-x:hidden;
  color:var(--auth-text);
}

body.auth-premium-page::before,
body.auth-premium-page::after{
  content:"";
  position:fixed;
  z-index:0;
  pointer-events:none;
  left:50%;
  transform:translateX(-50%);
}

body.auth-premium-page::before{
  top:-29vw;
  width:min(1240px,145vw);
  height:min(1240px,145vw);
  border:1px solid rgba(65,242,112,.34);
  border-radius:50%;
  box-shadow:
    inset 0 0 70px rgba(44,211,90,.035),
    0 0 36px rgba(54,230,107,.06);
  background:
    radial-gradient(circle at center,transparent 58%,rgba(255,255,255,.018) 58.3%,transparent 59.2%),
    radial-gradient(circle at center,transparent 69%,rgba(255,255,255,.018) 69.25%,transparent 70.1%);
}

body.auth-premium-page::after{
  top:0;
  bottom:0;
  width:min(100%,980px);
  background:
    linear-gradient(90deg,rgba(255,255,255,.018),transparent 8%,transparent 92%,rgba(255,255,255,.018)),
    repeating-linear-gradient(125deg,transparent 0 22px,rgba(255,255,255,.007) 23px 24px);
  opacity:.7;
}

.auth-gateway-shell,
.auth-register-shell{
  position:relative;
  z-index:1;
  width:min(calc(100% - 24px),760px) !important;
  max-width:760px !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 auto !important;
  padding:
    max(18px,calc(env(safe-area-inset-top) + 12px))
    0
    max(28px,calc(env(safe-area-inset-bottom) + 20px)) !important;
  display:block !important;
}

.auth-brand{
  margin:0 0 18px !important;
  text-align:center;
}

.auth-brand .kovra-logo-login{
  width:clamp(230px,56vw,360px) !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 auto 12px !important;
}

.auth-brand .kovra-logo-image{
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}

.auth-logo-ornament{
  width:210px;
  height:12px;
  margin:0 auto 10px;
  position:relative;
}

.auth-logo-ornament::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:5px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(83,241,127,.14),rgba(83,241,127,.62),rgba(83,241,127,.14),transparent);
  box-shadow:0 0 9px rgba(83,241,127,.18);
}

.auth-logo-ornament::after{
  content:"◇";
  position:absolute;
  top:-2px;
  left:50%;
  transform:translateX(-50%);
  color:var(--auth-green);
  font-size:10px;
  line-height:1;
  background:#040806;
  padding:0 7px;
}

.auth-hero-line{
  margin:0 !important;
  color:#b8c3bc !important;
  font-size:clamp(17px,4.5vw,23px) !important;
  font-weight:520 !important;
  letter-spacing:-.02em;
  line-height:1.2 !important;
}

.auth-hero-line strong{
  color:var(--auth-green);
  font-weight:680;
}

.auth-hero-line strong::after{
  content:"";
  display:block;
  width:104px;
  height:1px;
  margin:7px auto 0;
  background:linear-gradient(90deg,transparent,var(--auth-green),transparent);
  transform:rotate(-4deg);
  box-shadow:0 0 8px rgba(83,241,127,.18);
}

.auth-main-card,
.auth-register-card{
  position:relative;
  margin:0 !important;
  padding:22px 24px 20px !important;
  overflow:hidden;
  border:1px solid rgba(84,238,126,.24) !important;
  border-radius:24px !important;
  background:
    linear-gradient(145deg,rgba(14,22,18,.985),rgba(6,12,9,.99)) !important;
  box-shadow:
    0 24px 70px rgba(0,0,0,.44),
    inset 0 1px 0 rgba(255,255,255,.025),
    0 0 32px rgba(54,230,107,.035) !important;
}

.auth-main-card::before,
.auth-register-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 0,rgba(73,238,121,.055),transparent 35%),
    linear-gradient(90deg,transparent,rgba(255,255,255,.008),transparent);
}

.auth-mode-tabs{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  margin:-2px 0 24px;
  border-bottom:1px solid rgba(255,255,255,.075);
}

.auth-tab{
  position:relative;
  min-width:0;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 7px 15px;
  border:0 !important;
  background:transparent !important;
  color:#8f9993 !important;
  text-decoration:none;
  font-size:12px !important;
  font-weight:680 !important;
  line-height:1.1;
  cursor:pointer;
}

.auth-tab + .auth-tab{
  border-left:1px solid rgba(255,255,255,.045) !important;
}

.auth-tab svg{
  width:20px;
  height:20px;
  flex:0 0 20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
}

.auth-tab.active{
  color:var(--auth-green) !important;
}

.auth-tab.active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  background:linear-gradient(90deg,transparent 2%,var(--auth-green) 20%,var(--auth-green) 80%,transparent 98%);
  box-shadow:0 0 10px rgba(83,241,127,.45);
}

.auth-card-title{
  margin:0 0 17px !important;
}

.auth-card-title > span{
  color:var(--auth-green) !important;
  font-size:12px !important;
  font-weight:850 !important;
  letter-spacing:.12em !important;
}

.auth-card-title h2,
.auth-register-card .register-header h1{
  margin:3px 0 4px !important;
  color:#fff !important;
  font-size:clamp(21px,4.6vw,27px) !important;
  font-weight:820 !important;
  letter-spacing:-.025em;
}

.auth-card-title p{
  margin:0 !important;
  color:var(--auth-soft) !important;
  font-size:12.5px !important;
  line-height:1.5 !important;
}

.auth-main-card .field,
.auth-register-card .field{
  margin-bottom:14px !important;
}

.auth-main-card .field > span,
.auth-register-card .field > span{
  margin:0 0 7px !important;
  color:#d4ddd7 !important;
  font-size:12.5px !important;
  font-weight:620 !important;
}

.auth-input-shell,
.auth-main-card .password-field{
  position:relative;
  display:grid !important;
  grid-template-columns:38px minmax(0,1fr) auto !important;
  align-items:center;
  min-height:58px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13) !important;
  border-radius:14px !important;
  background:rgba(1,6,3,.56) !important;
  box-shadow:inset 0 0 22px rgba(0,0,0,.18);
}

.auth-input-shell:focus-within,
.auth-main-card .password-field:focus-within{
  border-color:rgba(83,241,127,.5) !important;
  box-shadow:
    0 0 0 3px rgba(83,241,127,.045),
    inset 0 0 22px rgba(0,0,0,.18) !important;
}

.auth-input-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  color:var(--auth-green);
}

.auth-input-icon svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
}

.auth-input-shell input,
.auth-main-card .password-field input,
.auth-register-card input{
  width:100% !important;
  min-width:0;
  height:56px !important;
  padding:0 12px !important;
  border:0 !important;
  outline:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#fff !important;
  font-size:16px !important;
  box-shadow:none !important;
}

.auth-input-shell input::placeholder,
.auth-main-card input::placeholder,
.auth-register-card input::placeholder{
  color:#66716a !important;
  opacity:1;
}

.auth-main-card .password-field button{
  min-width:54px !important;
  height:56px;
  border:0 !important;
  border-left:1px solid rgba(255,255,255,.07) !important;
  background:transparent !important;
  color:#b2bdb6 !important;
  font-size:12px !important;
  font-weight:750 !important;
}

.auth-forgot-link{
  width:auto !important;
  min-height:0 !important;
  display:block !important;
  margin:-2px 4px 17px auto !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:var(--auth-green) !important;
  font-size:12px !important;
  font-weight:680 !important;
  text-align:right;
}

.auth-primary-button,
.auth-main-card .login-button,
.auth-register-card .create-button{
  position:relative;
  width:100% !important;
  min-height:58px !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:0 50px 0 18px !important;
  border:1px solid rgba(130,255,161,.56) !important;
  border-radius:14px !important;
  background:
    linear-gradient(100deg,#6fdc48 0%,#42ac33 42%,#277d28 100%) !important;
  color:white !important;
  font-size:16px !important;
  font-weight:760 !important;
  letter-spacing:.005em;
  text-shadow:0 1px 1px rgba(0,0,0,.24);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    0 8px 24px rgba(46,184,70,.13),
    0 0 20px rgba(83,241,127,.08) !important;
  cursor:pointer;
}

.auth-button-arrow{
  position:absolute;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  font-size:25px;
  font-weight:300;
}

.auth-trust-line{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.06);
  color:#8d9891;
  font-size:12px;
  text-align:center;
}

.auth-trust-line svg{
  width:18px;
  height:18px;
  color:var(--auth-green);
  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
}

.auth-main-card .legacy-access{
  margin-top:13px !important;
  border-color:rgba(83,241,127,.1) !important;
  background:rgba(83,241,127,.025) !important;
}

.auth-main-card .restore-account-button{
  min-height:40px !important;
  margin-top:10px !important;
  border-color:rgba(255,255,255,.075) !important;
  background:rgba(255,255,255,.018) !important;
  color:#9aa59f !important;
  font-size:12px !important;
}

/* Registro: conserva todos los campos y la lógica, pero dentro del mismo portal visual. */
.auth-register-shell .register-header{
  margin:0 0 16px !important;
  text-align:left;
}

.auth-register-shell .register-header > div > span{
  color:var(--auth-green) !important;
  font-size:12px !important;
  font-weight:850 !important;
  letter-spacing:.12em !important;
}

.auth-register-card .register-form{
  display:block;
}

.auth-register-card .form-card,
.auth-register-card .id-preview-card{
  margin:0 0 14px !important;
  padding:16px !important;
  border:1px solid rgba(255,255,255,.075) !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.017) !important;
  box-shadow:none !important;
}

.auth-register-card .form-card .eyebrow,
.auth-register-card .id-preview-card > span{
  color:var(--auth-green) !important;
  font-size:12px !important;
  font-weight:850 !important;
  letter-spacing:.1em !important;
}

.auth-register-card .form-card h2{
  margin:3px 0 14px !important;
  font-size:17px !important;
  color:white !important;
}

.auth-register-card .name-availability,
.auth-register-card .id-preview-card p{
  color:#87928b !important;
  font-size:12px !important;
  line-height:1.45 !important;
}

.auth-register-card .id-preview-card strong{
  color:white !important;
}

.auth-register-card .back-button,
.auth-recovery-back{
  width:100% !important;
  min-height:42px !important;
  margin-top:9px !important;
  border:1px solid rgba(255,255,255,.075) !important;
  border-radius:12px !important;
  background:rgba(255,255,255,.018) !important;
  color:#b9c3bd !important;
  font-size:12px !important;
  font-weight:700 !important;
}

/* Sección informativa igual al concepto aprobado. */
.auth-benefits{
  position:relative;
  margin:18px 0 0;
  padding:22px 22px 18px;
  overflow:hidden;
  border:1px solid rgba(83,241,127,.29);
  border-radius:23px;
  background:
    radial-gradient(circle at 12% 42%,rgba(61,223,103,.075),transparent 28%),
    linear-gradient(145deg,rgba(7,17,11,.985),rgba(2,8,5,.995));
  box-shadow:0 18px 55px rgba(0,0,0,.34),0 0 28px rgba(54,230,107,.025);
}

.auth-benefits::after{
  content:"";
  position:absolute;
  right:-40px;
  top:30px;
  width:220px;
  height:260px;
  opacity:.15;
  background-image:radial-gradient(rgba(83,241,127,.7) .7px,transparent .8px);
  background-size:9px 9px;
  mask-image:linear-gradient(90deg,transparent,#000);
}

.auth-benefits-head{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  gap:12px;
  align-items:start;
  margin-bottom:16px;
}

.auth-benefits-badge{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border:1px solid rgba(83,241,127,.38);
  border-radius:50%;
  color:var(--auth-green);
  background:radial-gradient(circle,rgba(83,241,127,.13),rgba(83,241,127,.035));
  box-shadow:0 0 20px rgba(83,241,127,.08);
}

.auth-benefits-badge svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
}

.auth-benefits h2{
  margin:1px 0 5px;
  color:white;
  font-size:clamp(20px,4.8vw,27px);
  line-height:1.15;
  letter-spacing:-.025em;
}

.auth-benefits h2 strong{
  color:var(--auth-green);
  font-weight:800;
}

.auth-benefits-head p{
  margin:0;
  color:#9ba69f;
  font-size:12px;
  line-height:1.45;
}

.auth-benefits-body{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(150px,.8fr) minmax(0,1.5fr);
  gap:18px;
  align-items:stretch;
}

.auth-product-visual{
  position:relative;
  min-height:265px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:hidden;
  border-right:1px solid rgba(255,255,255,.05);
}

.auth-platform{
  position:absolute;
  left:7%;
  right:8%;
  bottom:2px;
  height:66px;
  border:1px solid rgba(83,241,127,.24);
  border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(63,221,102,.12),rgba(4,10,6,.94) 65%);
  box-shadow:0 8px 35px rgba(0,0,0,.55),0 0 16px rgba(83,241,127,.07);
}

.auth-cloud{
  position:absolute;
  top:18px;
  left:27px;
  width:91px;
  height:51px;
  display:grid;
  place-items:center;
  border:1px solid rgba(83,241,127,.34);
  border-radius:30px;
  background:linear-gradient(145deg,#17241b,#0a120d);
  color:#baffc9;
  font-size:30px;
  font-weight:900;
  box-shadow:0 0 23px rgba(83,241,127,.12);
}

.auth-cloud::before,
.auth-cloud::after{
  content:"";
  position:absolute;
  background:inherit;
  border:inherit;
  border-bottom:0;
  border-radius:50%;
}

.auth-cloud::before{width:42px;height:42px;left:12px;top:-18px;}
.auth-cloud::after{width:34px;height:34px;right:12px;top:-11px;}
.auth-cloud span{position:relative;z-index:2;}

.auth-sync-lines{
  position:absolute;
  top:72px;
  left:58px;
  width:44px;
  height:45px;
  background:repeating-linear-gradient(90deg,transparent 0 8px,rgba(83,241,127,.34) 9px 10px);
  mask-image:linear-gradient(#000,transparent);
}

.auth-mini-dashboard{
  position:absolute;
  left:19px;
  bottom:39px;
  width:134px;
  height:131px;
  padding:12px;
  transform:perspective(300px) rotateY(7deg) rotateX(2deg);
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  background:linear-gradient(145deg,#18221b,#080e0a);
  box-shadow:0 16px 28px rgba(0,0,0,.4),0 0 12px rgba(83,241,127,.05);
}

.auth-mini-dashboard small{
  display:block;
  color:#cbd5ce;
  font-size:12px;
  margin-bottom:9px;
}

.auth-mini-dashboard svg{width:100%;height:55px;overflow:visible;}
.auth-mini-dashboard .chart-grid{stroke:rgba(255,255,255,.07);stroke-width:.7;}
.auth-mini-dashboard .chart-line{fill:none;stroke:var(--auth-green);stroke-width:2;filter:drop-shadow(0 0 3px rgba(83,241,127,.25));}

.auth-mini-bars{
  display:grid;
  grid-template-columns:36px 1fr;
  gap:8px;
  margin-top:4px;
}

.auth-donut{
  width:31px;height:31px;border-radius:50%;
  background:conic-gradient(var(--auth-green) 0 68%,rgba(255,255,255,.08) 68% 100%);
  position:relative;
}
.auth-donut::after{content:"";position:absolute;inset:7px;border-radius:50%;background:#101812;}
.auth-lines{display:grid;gap:4px;align-content:center;}
.auth-lines i{display:block;height:3px;border-radius:3px;background:linear-gradient(90deg,rgba(83,241,127,.55),rgba(255,255,255,.08));}
.auth-lines i:nth-child(2){width:78%;}.auth-lines i:nth-child(3){width:58%;}

.auth-coins{
  position:absolute;
  right:11px;
  bottom:29px;
  width:67px;
  height:47px;
}
.auth-coins::before,
.auth-coins::after{
  content:"K";
  position:absolute;
  left:0;
  width:64px;
  height:24px;
  display:grid;
  place-items:center;
  border:1px solid rgba(83,241,127,.24);
  border-radius:50%;
  background:linear-gradient(180deg,#253329,#111912);
  color:#9cffb4;
  font-size:15px;
  font-weight:900;
}
.auth-coins::before{bottom:0;box-shadow:0 -8px 0 #19241b,0 -16px 0 #1d2920;}
.auth-coins::after{bottom:16px;}

.auth-feature-list{
  display:grid;
  align-content:center;
}

.auth-feature{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:11px;
  align-items:center;
  padding:10px 0;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.auth-feature:last-child{border-bottom:0;}

.auth-feature-icon{
  width:39px;
  height:39px;
  display:grid;
  place-items:center;
  border:1px solid rgba(83,241,127,.18);
  border-radius:50%;
  background:rgba(83,241,127,.035);
  color:var(--auth-green);
}
.auth-feature-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;}

.auth-feature p{
  margin:0;
  color:#d4ddd7;
  font-size:12.5px;
  line-height:1.38;
}
.auth-feature p strong{color:var(--auth-green);font-weight:720;}

.auth-footer-trust{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:16px auto 0;
  color:#8e9992;
  font-size:12px;
  text-align:center;
}
.auth-footer-trust svg{width:18px;height:18px;color:var(--auth-green);fill:none;stroke:currentColor;stroke-width:1.55;}
.auth-footer-trust strong{color:var(--auth-green);font-weight:750;}

.auth-disclaimer{
  margin:8px auto 0;
  color:#7f8b84;
  font-size:12px;
  line-height:1.45;
  text-align:center;
}
.auth-disclaimer strong{color:#aeb8b2;font-weight:720;}

/* Modales del acceso mantienen su lógica y adoptan el acabado premium. */
.auth-premium-page .restore-account-card,
.auth-premium-page .mfa-login-card{
  border-color:rgba(83,241,127,.24) !important;
  border-radius:20px !important;
  background:linear-gradient(145deg,#101914,#070d09) !important;
  box-shadow:0 28px 80px rgba(0,0,0,.58) !important;
}

@media(max-width:620px){
  .auth-gateway-shell,
  .auth-register-shell{width:min(calc(100% - 20px),520px) !important;}
  .auth-main-card,
  .auth-register-card{padding:16px 15px 15px !important;border-radius:20px !important;}
  .auth-mode-tabs{margin-bottom:18px;}
  .auth-tab{min-height:50px;gap:5px;padding:8px 3px 13px;font-size:12px !important;}
  .auth-tab svg{width:18px;height:18px;flex-basis:18px;}
  .auth-brand{margin-bottom:14px !important;}
  .auth-brand .kovra-logo-login{width:clamp(230px,70vw,330px) !important;margin-bottom:8px !important;}
  .auth-benefits{padding:17px 15px 14px;border-radius:20px;}
  .auth-benefits-head{grid-template-columns:44px minmax(0,1fr);gap:10px;margin-bottom:11px;}
  .auth-benefits-badge{width:43px;height:43px;}
  .auth-benefits h2{font-size:20px;}
  .auth-benefits-head p{font-size:12px;}
  .auth-benefits-body{grid-template-columns:36% minmax(0,1fr);gap:11px;}
  .auth-product-visual{min-height:250px;}
  .auth-cloud{left:9px;width:76px;height:44px;font-size:24px;}
  .auth-cloud::before{width:36px;height:36px;left:10px;top:-15px;}
  .auth-cloud::after{width:29px;height:29px;right:9px;top:-9px;}
  .auth-sync-lines{left:37px;}
  .auth-mini-dashboard{left:2px;width:108px;height:119px;padding:9px;}
  .auth-coins{right:0;transform:scale(.82);transform-origin:right bottom;}
  .auth-feature{grid-template-columns:34px minmax(0,1fr);gap:8px;padding:8px 0;}
  .auth-feature-icon{width:32px;height:32px;}
  .auth-feature-icon svg{width:17px;height:17px;}
  .auth-feature p{font-size:12px;line-height:1.35;}
  .auth-trust-line{font-size:12px;}
}

@media(max-width:365px){
  .auth-tab{font-size:12px !important;}
  .auth-tab svg{display:none;}
  .auth-benefits-body{grid-template-columns:1fr;}
  .auth-product-visual{min-height:205px;border-right:0;border-bottom:1px solid rgba(255,255,255,.05);}
  .auth-feature p{font-size:12px;}
}