.auth-pending .sidebar,.auth-pending .app-shell,.auth-pending #toast-region,.auth-pending #particles{visibility:hidden}

.auth-gate{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:clamp(20px,4vw,64px);
  overflow:auto;
  color:#f7f0df;
  font-family:inherit;
  background:
    linear-gradient(90deg,rgba(4,8,14,.12) 0%,rgba(4,8,14,.22) 38%,rgba(5,10,18,.68) 62%,rgba(5,10,18,.93) 100%),
    url('./assets/login-thronebound-bg.png.png') center center/cover no-repeat;
}
.auth-gate:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 24% 36%,rgba(255,177,70,.09),transparent 30%),
    radial-gradient(circle at 78% 42%,rgba(75,158,255,.08),transparent 34%),
    linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.38));
}
.auth-gate:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  box-shadow:inset 0 0 120px rgba(0,0,0,.58);
}
.auth-panel{
  position:relative;
  z-index:1;
  width:min(430px,100%);
  margin-right:clamp(0px,4vw,72px);
  padding:34px 30px 28px;
  border:1px solid rgba(225,190,109,.48);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(9,17,28,.88),rgba(5,11,20,.92));
  box-shadow:0 28px 90px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.025) inset;
  backdrop-filter:blur(14px) saturate(125%);
}
.auth-crown{
  width:56px;
  height:56px;
  margin:0 auto;
  display:grid;
  place-items:center;
  border:1px solid rgba(226,193,112,.5);
  border-radius:18px;
  background:radial-gradient(circle at 50% 30%,rgba(229,199,125,.2),rgba(19,32,48,.35));
  box-shadow:0 10px 30px rgba(0,0,0,.28);
  text-align:center;
  font-size:31px;
  color:#e5c77d;
  line-height:1;
}
.auth-eyebrow{
  text-align:center;
  letter-spacing:.28em;
  font-size:12px;
  font-weight:900;
  color:#e7c773;
  margin:14px 0 7px;
}
.auth-panel h1{
  text-align:center;
  margin:0;
  font-size:30px;
  color:#fff6df;
  text-shadow:0 2px 16px rgba(0,0,0,.35);
}
.auth-sub{
  text-align:center;
  color:#aeb9c6;
  margin:10px 0 24px;
  line-height:1.55;
}
.auth-panel label{
  display:grid;
  gap:8px;
  margin:14px 0;
  color:#dfe6ec;
  font-size:14px;
  font-weight:800;
}
.auth-panel input{
  width:100%;
  box-sizing:border-box;
  border:1px solid #30445a;
  border-radius:12px;
  padding:13px 14px;
  background:rgba(5,13,23,.84);
  color:#fff;
  font:inherit;
  outline:none;
  transition:.18s ease;
}
.auth-panel input:focus{
  border-color:#d8b96f;
  box-shadow:0 0 0 3px rgba(216,185,111,.14),0 8px 26px rgba(0,0,0,.18);
  background:rgba(7,16,27,.96);
}
.auth-primary,.auth-switch{
  width:100%;
  border-radius:12px;
  padding:13px 16px;
  font:inherit;
  font-weight:900;
  cursor:pointer;
  transition:.18s ease;
}
.auth-primary{
  margin-top:4px;
  border:1px solid #efcf82;
  background:linear-gradient(135deg,#f0d38a,#b88335);
  color:#18202a;
  box-shadow:0 10px 28px rgba(181,126,47,.22);
}
.auth-primary:hover{transform:translateY(-1px);filter:brightness(1.04)}
.auth-primary:disabled{opacity:.55;cursor:wait;transform:none}
.auth-switch{
  margin-top:12px;
  background:rgba(17,38,52,.62);
  color:#9fe2d1;
  border:1px solid #315563;
}
.auth-switch:hover{background:rgba(24,50,67,.76)}
.auth-error{min-height:22px;margin:8px 0;color:#ffaaa3;font-size:13px}
.auth-note{text-align:center;margin:14px 0 0;color:#7f93a4;font-size:12px}
.auth-account-control{
  position:fixed;
  right:14px;
  bottom:76px;
  z-index:1200;
  border:1px solid rgba(222,191,116,.32);
  border-radius:999px;
  padding:8px 12px;
  background:rgba(11,27,41,.88);
  color:#d9c383;
  font:inherit;
  font-size:12px;
  cursor:pointer;
  backdrop-filter:blur(10px);
}
.auth-account-control:hover{background:#1b3548}

@media(max-width:900px){
  .auth-gate{
    justify-content:center;
    background:
      linear-gradient(180deg,rgba(4,8,14,.26),rgba(4,8,14,.66) 52%,rgba(4,8,14,.9) 100%),
      url('./assets/login-thronebound-bg.png.png') 42% center/cover no-repeat;
  }
  .auth-panel{margin-right:0}
}
@media(max-width:700px){
  .auth-gate{padding:18px 14px}
  .auth-panel{padding:27px 20px 22px;border-radius:20px;background:rgba(6,14,24,.91)}
  .auth-panel h1{font-size:26px}
  .auth-account-control{bottom:92px;right:10px;font-size:11px}
}
