.auth-button,.welcome-login{
  display:block;
  text-decoration:none;
  text-align:center;
  background:var(--accent);
  color:#fff;
  border:0;
  border-radius:10px;
  padding:11px 12px;
  font-size:12px;
  font-weight:700;
  width:100%;
  cursor:pointer;
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.auth-button:hover,.welcome-login:hover{background:var(--accent-hover)}
.auth-button:active,.welcome-login:active{transform:scale(.98)}
.auth-button.subtle{
  background:var(--bg-elevated);
  color:var(--text-brand);
  border:1px solid var(--border-strong);
}
.auth-button.subtle:hover{
  border-color:var(--accent-soft);
  background:var(--bg-elevated-hover);
}
.welcome-login{
  max-width:240px;
  margin:0 auto 24px;
  padding:12px 16px;
}
textarea:disabled{
  background:var(--bg-input-disabled);
  color:var(--text-faint);
  cursor:not-allowed;
}
[hidden]{display:none!important}

.auth-page{
  min-height:100dvh;
  display:grid;
  place-items:center;
  padding:24px;
  position:relative;
}
.auth-card{
  width:min(100%,400px);
  background:
    linear-gradient(160deg, var(--card-shine), transparent 55%),
    var(--bg-composer);
  border:1px solid var(--border);
  border-radius:20px;
  padding:36px 28px 30px;
  text-align:center;
  box-shadow:
    0 20px 50px #00000040,
    0 0 0 1px color-mix(in srgb, var(--accent) calc(var(--fx-opacity, 0) * 16%), transparent);
  position:relative;
  z-index:1;
  overflow:hidden;
}
.auth-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:radial-gradient(var(--pattern-dot) 1px, transparent 1px);
  background-size:16px 16px;
  opacity:.7;
  mask-image:linear-gradient(180deg, #000, transparent 70%);
}
.auth-card .hero{
  width:auto;
  height:108px;
  margin:0 auto 18px;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.auth-card > p{
  margin:10px 0 26px;
  color:var(--text-muted);
  font-size:13px;
  line-height:1.55;
}
.auth-card form{display:grid;gap:14px;text-align:left}
.auth-card label{
  display:grid;
  gap:6px;
  font-size:12px;
  font-weight:650;
  color:var(--text-muted);
}
.auth-card input{
  width:100%;
  background:var(--bg);
  border:1px solid var(--border-strong);
  border-radius:10px;
  padding:12px 13px;
  color:var(--text-strong);
  font:inherit;
  transition:border-color .15s ease;
}
.auth-card input:focus{outline:0;border-color:var(--accent-soft)}
.auth-error{margin:0;color:var(--error);font-size:12px;text-align:left}
.auth-card .auth-button{margin-top:4px;padding:13px;font-size:13px}

.sidebar-user{
  font-size:11px;
  color:var(--text-muted);
  padding:0 2px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  line-height:1.35;
}
.sidebar-links{display:grid;gap:8px}