/* Auth — лендинг входа (desktop + mobile). Колонка: иначе на телефоне #auth сжимается в «палку». */
body.auth-page{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0;
  overflow-x:hidden;
  overflow-y:auto;
  min-height:100%;
  min-height:100dvh;
  width:100%;
  box-sizing:border-box;
  padding:max(16px,env(safe-area-inset-top)) 16px max(20px,env(safe-area-inset-bottom));
  background:radial-gradient(1300px 900px at 50% 84%,#2c2117 0%,#241d18 38%,#14100d 74%,#0d0a08 100%);
  position:relative;
}
body.auth-page::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 100%,rgba(224,194,90,.18),rgba(201,120,39,.06) 50%,transparent 75%);
  pointer-events:none;animation:vv-breathe 4s ease-in-out infinite;
}
body.auth-page::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 52%,transparent 30%,rgba(0,0,0,.66) 100%);
}
.auth-ember{
  position:absolute;border-radius:50%;pointer-events:none;z-index:0;
}
.auth-ember-1{left:48%;bottom:9%;width:4px;height:4px;background:#f0d47a;box-shadow:0 0 9px 3px rgba(224,194,90,.75);animation:ember 5.4s linear infinite;}
.auth-ember-2{left:53%;bottom:12%;width:3px;height:3px;background:#e0c25a;box-shadow:0 0 7px 2px rgba(224,194,90,.6);animation:ember2 6.8s linear 2.4s infinite;}
.auth-ember-3{left:45%;bottom:14%;width:2px;height:2px;background:#c9a227;animation:ember 7s linear 1s infinite;}
.auth-ember-4{left:56%;bottom:10%;width:2px;height:2px;background:#e0c25a;animation:ember2 5.6s linear 3s infinite;}

.auth-brand,
#auth,
.auth-foot,
.mobile-desktop-link{
  position:relative;z-index:1;
  flex:0 0 auto;
  width:min(480px,100%);
  max-width:100%;
}

.auth-brand{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  margin:0 0 22px;text-align:center;
}
.auth-brand .eyebrow{
  font-size:11px;letter-spacing:.36em;text-transform:uppercase;
  color:var(--gold);
}
.auth-brand h1{
  font-family:var(--font-display,var(--font));
  font-size:clamp(32px,10vw,56px);font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;margin:0;padding:0;border:none;
  color:var(--parchment);text-shadow:0 4px 50px rgba(224,194,90,.2);
  line-height:1.15;word-break:normal;
}
.auth-brand .subtitle{
  font-style:italic;font-size:clamp(13px,3.6vw,15px);
  color:var(--parchment-dim);margin:0;max-width:28em;line-height:1.45;
}

#auth{
  padding:0;overflow:hidden;
  background:linear-gradient(180deg,rgba(43,33,25,.96),rgba(23,18,14,.96));
  border:1px solid var(--border);border-radius:6px;
  box-shadow:0 24px 48px -20px rgba(0,0,0,.85),0 8px 20px rgba(0,0,0,.55),inset 0 1px 0 rgba(232,220,196,.09);
}
#auth::before{display:none;}
#auth > h1,#auth > .subtitle,#auth > .auth-divider{display:none;}

.tabs{
  display:flex;margin:0;border-bottom:none;gap:0;
}
.tabs button{
  flex:1;text-align:center;padding:14px 8px;
  font-family:inherit;font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--parchment-dim);background:transparent;border:none;
  border-bottom:1px solid var(--border);margin:0;
  cursor:pointer;border-radius:0;min-height:48px;
  transition:color .15s,border-color .15s,background .15s;
  -webkit-tap-highlight-color:transparent;
}
.tabs button:hover{color:var(--parchment);}
.tabs button.active{
  color:var(--gold-bright);
  background:linear-gradient(180deg,#332818,#241d18);
  border-bottom-color:var(--gold);
}

#authForm{
  padding:22px 18px 24px;
  display:flex;flex-direction:column;gap:2px;
}
@media (min-width:480px){
  #authForm{padding:28px 32px 30px;}
  .tabs button{letter-spacing:.26em;font-size:12px;padding:16px 0;}
  .auth-brand{margin-bottom:28px;gap:12px;}
}
#auth label{
  display:block;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--parchment-dim);margin:0 0 8px;
}
#auth input{
  width:100%;box-sizing:border-box;
  background:linear-gradient(180deg,#171310,#1e1813);
  border:1px solid var(--border);border-radius:6px;
  padding:14px 16px;font-family:inherit;font-size:16px;color:var(--parchment);
  outline:none;margin-bottom:14px;
  box-shadow:inset 0 2px 8px rgba(0,0,0,.5);
}
#auth input:focus{
  border-color:var(--gold);
  box-shadow:inset 0 2px 8px rgba(0,0,0,.5),0 0 0 3px rgba(201,162,39,.15);
}
#submitBtn{
  width:100%;margin-top:6px;padding:14px;
  background:linear-gradient(180deg,var(--gold-bright),var(--gold-deep,#b8901f));
  border:1px solid var(--gold-edge,#8a6d1a);border-radius:6px;
  color:var(--stone-mid,#241d18);font-family:inherit;font-size:13px;
  letter-spacing:.18em;text-transform:uppercase;cursor:pointer;
  min-height:48px;
  box-shadow:0 10px 26px -8px rgba(201,162,39,.45),inset 0 1px 0 rgba(255,240,200,.55);
  transition:background .15s;
  -webkit-tap-highlight-color:transparent;
}
#submitBtn:hover{background:linear-gradient(180deg,#eccd6b,#c49a26);}
#submitBtn:disabled{opacity:.5;cursor:wait;}
.auth-forgot{
  display:block;margin:12px 0 0;text-align:center;
  font-size:12px;font-style:italic;color:var(--parchment-mute,#7d7060);
  text-decoration:underline;text-underline-offset:3px;
}
.auth-forgot:hover{color:var(--parchment-dim);}
#error{
  min-height:18px;margin-top:12px;text-align:center;
  font-size:12px;color:var(--blood-bright);
}
.auth-foot{
  font-style:italic;font-size:12px;color:var(--parchment-mute,#7d7060);
  text-align:center;margin-top:16px;
}
.auth-divider{
  display:flex;align-items:center;gap:10px;margin:16px 0 18px;
  color:var(--border);font-size:10px;
}
.auth-divider::before,.auth-divider::after{
  content:'';flex:1;height:1px;
  background:linear-gradient(90deg,transparent,var(--border));
}
.auth-divider::after{background:linear-gradient(90deg,var(--border),transparent);}
.mobile-desktop-link{
  margin-top:14px;font-size:12px;text-align:center;
}
.mobile-desktop-link a{
  color:var(--gold-bright);
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:8px 12px;
}
